@import "kb.scss";
@import 'common.scss';

@import 'emoji-sprite.scss';

@import 'test.scss';

@font-face {
    font-family: 'seguiemjt';
    // src: url../../../public/fonts/seguiemjt.ttf') format('truetype');
    font-family: 'Segoe UI';
    font-weight: 400;
    font-display: swap;
    src: local("Segoe UI Light"),
        url('/../fonts/latest.woff2') format("woff2"),
        url('/../fonts/latest.woff') format("woff"),
        url('/../fonts/latest.ttf') format("truetype");
}

.slide-fade-enter-active {
    transition: all .3s ease;
}

.slide-fade-leave-active {
    transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}

.slide-fade-enter,
.slide-fade-leave-to

/* .slide-fade-leave-active for below version 2.1.8 */
    {
    transform: translateX(10px);
    opacity: 0;
}


.el-form {

    .el-input__inner,
    .el-textarea__inner {
        border-radius: 0
    }

    .el-table .cell {
        line-height: 1;
    }
}

.el-picker-panel__footer {
    .el-button--text {
        display: none;
    }
}

.Tailoring5 {
    .el-dialog__body {
        padding: 30px 20px;
    }

    .el-input {
        width: 250px;
        margin-right: 20px;
    }

    .el-tag {
        margin-right: 10px;

        &:first-of-type {
            i {
                display: none;
            }
        }
    }
}

.add-videoCate {
    margin-left: 20px;
}




.classTeest_rT {
    blockquote {
        display: block;
        border-left: 8px solid #d0e5f2;
        padding: 5px 10px;
        margin: 10px 0;
        line-height: 1.4;
        font-size: 100%;
        background-color: #f1f1f1;
    }

    p {
        a {
            color: #409EFF;
            text-decoration: underline;
        }
    }
}




button {
    font-size: initial;
    margin-top: 0;
    text-shadow: initial;
    font-family: initial;
}

.activePath {
    display: none !important;
}

.el-table {
    text-align: center;

    td,
    th {
        padding: 8px 0;
    }

    th {
        border-right: 1px solid #e0e0e0;
    }

    .cell {
        .el-button {
            padding: 0;
        }

        button,
        a {
            margin-left: 5px;
        }

        .delete-btn {
            &:hover {
                color: #f96666
            }
        }
    }
}

#reception {
    height: 100%;
}

#main {
    min-height: calc(100vh - 124px);
}

body {
    background: #e0f3f9 url('/../images/bgc01.png') no-repeat;
    background-size: cover;

}

html,
body {
    min-width: 1280px;
}

html {
    // overflow-y: scroll;
}

*,
*:after,
*:before {
    box-sizing: initial
}

.i_maxW {
    max-width: 1000px;
    margin: 0 auto;
}



.svg-icon {
    vertical-align: middle;
}

#app {
    width: 100%;
    height: 100%;
}

.userP {
    display: flex;
    justify-content: space-between;
    padding-top: 45px;

}



.user_img {
    >span {
        display: inline-block;
        vertical-align: top;
        width: 80px;
        height: 80px;
        border-radius: 50%;
        overflow: hidden;
        box-shadow: $shadow2;
        margin-right: 15px;
        border: 5px solid #fff;
        box-shadow: $shadow;

        >img {
            width: 100%;
            height: 100%;
        }
    }
}



.user_name {

    // margin-top: 10px;
    >h3 {
        font-size: 22px;
        line-height: 90px;
    }

    div {
        font-size: 12px;
        color: #3B687E;
        margin-top: 15px;
    }
}

.user_if {
    >span {
        font-size: 14px;
        margin-right: 15px;
        font-size: 12px;
        color: #3B687E;
        line-height: 22px;

        >i {
            margin-right: 10px;
            vertical-align: top;
        }

        &:after {
            content: "";
            display: inline-block;
            vertical-align: middle;
            border-right: 1px solid #979797;
            ;
            height: 10px;
            padding-left: 15px;
        }

        &:last-of-type {
            margin: 0;

            &:after {
                display: none;
            }
        }
    }

    button {
        display: block;
        padding: 0;
        width: 100px;
        text-align: center;
        height: 32px;
        line-height: 32px;
        margin: 35px 0 0 67px;
        font-size: 12px;
    }
}

.user_px {
    text-align: right;
    margin-bottom: 15px;
}


.u_content {
    padding-bottom: 60px;
    display: flex;
    justify-content: space-between;
}


.content_l {
    width: 300px;
    border-radius: 3px;
    overflow: hidden;

    >div {
        margin-bottom: 20px;

        &:last-of-type {
            margin-bottom: 0;
        }
    }
}

.content_l1 {
    padding: 25px 20px;
    background: $bg_3;
    box-shadow: $shadow2;
    border-radius: 3px;
}

.U_keyword {
    font-size: 0;
    border-bottom: 1px solid #E8F2FF;
    padding-bottom: 6px;

    >span {
        display: inline-block;
        vertical-align: top;
        font-size: 14px;
        color: #3377AA;
        line-height: 19px;
        padding: 4.5px 5px;
        background: #E7F5FF;
        border: 1px solid #D8E9FF;
        border-radius: 3px;
        margin: 0 8px 8px 0;

        &:last-of-type {
            margin: 0 0 8px 0;
        }
    }
}

.u_info {
    padding: 0 10px;

    >a,
    >span {
        display: inline-block;
        vertical-align: top;
        float: left;
        margin: 25px 45px 0 0;
        cursor: pointer;

        p {
            text-align: center;
            line-height: 16px;
            margin-top: 12px;
        }

        &:nth-of-type(3n) {
            margin: 25px 0 0 0;
        }
    }

    .el-badge__content.is-fixed {
        right: 20px;
    }
}


.content_l2 {
    padding: 15px 20px 20px;
    background: $bg_3;
    box-shadow: $shadow2;
    border-radius: 3px;
}


.u_mail {
    >a {
        float: right;
        color: $sc_6;
        margin-left: 15px;

        >i {
            font-family: "Simsun";
            margin-left: 5px;
        }
    }
}


.u_mail2 {
    margin-top: 25px;

    >i,
    span {
        display: inline-block;
    }

    >i {
        vertical-align: super;
        font-size: 14px;
        margin: 0 60px 0 30px;
    }

    >span {

        >i,
        >strong,
        >em {
            display: block;
        }

        >strong,
        >em {
            font-size: 36px;
            color: #F1583B;
            line-height: 48px;
            margin-top: 10px;
        }

        >em {
            color: #DDDDDD;
        }
    }
}


.myapp {
    background: $bg_3;
    padding: 30px 0;
    height: 640px;

    .dependent {
        padding: 214px 0;
    }
}


.titleH {
    margin-bottom: 20px;
    padding: 0 35px;

    >span {
        font-size: 14px;
    }

    >em {
        font-size: 14px;
        color: $sc_6;
        cursor: pointer;
        float: right;
    }
}





.myapp_icon {
    font-size: 0;
    height: calc(100% - 33px);
    overflow-y: auto;
    padding: 0 29px;

    // padding: 0 35px;
    >a {
        display: inline-block;
        vertical-align: top;
        margin: 0 26px 30px 0;

        >img {
            width: 100px;
            height: 100px;
            overflow: hidden;
            transition: .3s;
            border-radius: 10px
        }

        >p {
            text-align: center;
            font-size: 14px;
            line-height: 19px;
            padding-top: 20px;
        }

        &:nth-of-type(5n) {
            margin: 0 0 30px 0;
        }

        &:hover {
            >img {
                box-shadow: $shadow
            }

            >p {
                color: $sc_6;
            }
        }
    }
}

.fade-app {
    -webkit-animation-duration: .2s;
    animation-duration: .2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fade-app;
    animation-name: fade-app
}

$i: 1;

@for $i from 1 through 30 {
    .myapp_icon>a:nth-of-type(#{$i}) {
        animation-duration: .2s * $i;
    }
}



@keyframes fade-app {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        -ms-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}


.u_crumbs {
    padding: 30px 0 20px;

    a {
        font-size: 14px;
        line-height: 19px;
        color: #888;
    }

    strong {
        font-size: 14px;

        i {
            color: #888;
            padding: 0 10px;
            font-family: "Simsun";
        }
    }
}

.communication {
    border-bottom: 1px solid #EEEEEE;
    padding: 20px 0 10px;

    >a {
        font-size: 16px;
        font-weight: bold;
        line-height: 21px;
        padding-left: 30px;
    }

    .showActive {
        color: $sc_6;
    }
}


.communicationBox {
    background: $bg_3;
    height: 724px;
}

// #mailList{
//  .communication_c{
//    margin: 0 10px;
//  }
// }


.communication_c {
    height: 672px;

    .el-scrollbar {
        height: 100%;
    }

    .is-horizontal {
        display: none;
    }

    .el-collapse-item__content {
        padding: 0;

    }

    .el-collapse-item__wrap {
        border: 0;
    }

    .el-scrollbar__wrap {
        overflow: hidden;
        height: 100%;
        overflow-y: scroll;
    }

    .el-collapse-item__header {
        height: 60px;
        padding: 15px 0 10px;
        line-height: 60px;
        position: relative;
        padding-left: 120px;
        font-size: 16px;
        color: #000000;

        &:before {
            content: '';
            display: inline-block;
            width: 60px;
            height: 60px;
            border-radius: 50%;
            background: $bg_5;
            overflow: hidden;
            position: absolute;
            top: 15px;
            left: 30px;
            background-image: url('/images/ipm.png');
            background-repeat: no-repeat;
        }

        &:before,
        &:after {
            box-sizing: initial;
        }
    }

    .el-collapse {
        border-top: 0;

        &:first-of-type {
            border-top: 1px solid #ebeef5;
        }
    }
}

.userGroup_b1 {
    .el-collapse-item__header {
        &:before {
            // background-position: -71px -160px;
            background-position: -361px -26px;
        }
    }

}

.userGroup_b2 {
    .el-collapse-item__header {
        &:before {
            // background-position: -71px -160px;
            background-position: -290px -26px;
        }
    }

}

.userGroup_b3 {
    .el-collapse-item__header {
        &:before {
            background-position: -290px -98px;
            // background-position: 0px -160px;
        }
    }

}


.userGroup {
    label {
        position: relative;
        display: block;
        cursor: pointer;
        border-bottom: 1px solid #EEEEEE;
        ;

        >input {
            display: none;
        }

        >input:checked+.userGroup_txt {
            background: #E8F2FF;
        }

        >span {
            position: absolute;
            top: 20px;
            right: 15px;
            opacity: 0;
            z-index: 2;
            @extend .i_transition;

            >i {
                font-size: 16px;
                color: red;
            }
        }

        &:hover {
            >span {
                opacity: 1;
            }
        }

        &:last-of-type {
            border-bottom: 0;
        }

        &:first-of-type {
            border-bottom: 1px solid #ebeef5;
        }
    }
}

.userGroup_txt {
    padding: 12px 0;
    cursor: pointer;
    position: relative;

    >.tips {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        overflow: hidden;
        background: red;
        position: absolute;
        top: 13px;
        left: 58px;
    }

    >div {
        &:nth-of-type(1) {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            text-align: center;
            line-height: 40px;
            color: $sc_1;
            margin: 0 20px 0 40px;
            overflow: hidden;

            >img {
                width: 100%;
                height: 100%;
            }
        }

        &:nth-of-type(2) {
            width: 170px;

            >p {
                height: 19px;
                @extend .i_text;

                // overflow: hidden;
                img {
                    width: 16px !important;
                    height: 16px !important;
                }

                &:nth-of-type(1) {
                    font-size: 14px;
                    line-height: 19px;
                    color: #000000;

                }

                &:nth-of-type(2) {
                    font-size: 12px;
                    color: $sc_5 !important;
                    line-height: 16px;
                    margin-top: 4px;
                    max-width: 90%;
                    @extend .i_text;
                    pointer-events: none;

                    >i {
                        padding: 0 5px;
                    }

                    p,
                    a,
                    span {
                        color: $sc_5 !important;
                    }
                }
            }
        }
    }
}


.userGroup2 {
    .userGroup_txt {
        >div {
            &:nth-of-type(1) {
                margin: 0 15px 0 25px;
            }
        }
    }
}

.userGroup_child {

    label {
        position: relative;
        display: block;
        cursor: pointer;
        border-bottom: 1px solid #EEEEEE;
        ;

        >input {
            display: none;
        }

        >input:checked+.userGroup_txt {
            background: #E8F2FF;
        }

        >span {
            position: absolute;
            top: 20px;
            right: 15px;
            opacity: 0;
            @extend .i_transition;
        }

        &:hover {
            >span {
                opacity: 1;
            }
        }

        &:last-of-type {
            border-bottom: 0;
        }
    }

    .el-collapse-item__header {
        padding: 0;
        padding-left: 30px;
        border-bottom: 1px solid #ebeef5;

        &:before {
            display: none;
        }
    }


}


.content_r {

    /* box-shadow: 0 1px 1px 0 rgba(0,0,0,0.10);
  border-radius: 3px; */
    // overflow: hidden;
}

.myapp {
    width: 680px;
    background: #FFFFFF;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    border-radius: 3px;
}

.capacity {
    margin-top: 20px;
    background: #fff;
    padding: 20px 35px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    border-radius: 3px;

    >p {
        line-height: 40px;
        font-size: 14px;
        color: #999;
    }
}


.usetInfo {
    background: $bg_3;
    height: 680px;
}

.usetInfo_h {
    padding: 30px 40px;
    background: url('/../images/bgc02.png') no-repeat;
    display: flex;
    justify-content: space-between;

    >div,
    a,
    span {
        display: inline-block;
        vertical-align: top;
        text-align: left;
        text-align-last: initial;
        cursor: pointer;
    }
}


.usetInfo_hp {
    >span {
        display: inline-block;
        vertical-align: top;

        &:nth-of-type(1) {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            overflow: hidden;
            background: $bg_3;
            line-height: 80px;
            text-align: center;
            color: $sc_1;

            >img {
                width: 100%;
                height: 100%;
            }
        }

        &:nth-of-type(2) {
            font-size: 24px;
            color: $sc_1;
            line-height: 80px;
            margin-left: 20px;
            max-width: 200px;
            @extend .i_text;
        }
    }
}


.sendMsg {
    width: 100px;
    height: 40px;
    background: $bg_3;
    border-radius: 40px;
    line-height: 40px;
    font-size: 14px;
    margin-top: 10px;

    >i {
        margin: 0 5px 0 10px;
    }
}

.usetInfo_word {
    font-size: 0;
    padding-bottom: 30px;
    margin: 20px 40px 20px;
    border-bottom: 1px solid #DDDDDD;

    >span {
        display: inline-block;
        vertical-align: top;
        font-size: 14px;
        color: #3377AA;
        line-height: 19px;
        padding: 5px;
        background: #E7F5FF;
        border: 1px solid #D8E9FF;
        border-radius: 3px;
        margin: 10px 10px 0 0;
    }
}

.usetInfo_wp {
    margin: 0 40px 0;
}

.usetInfo_lx {
    text-align: center;
    text-align-last: justify;
    padding-bottom: 30px;
    margin-bottom: 20px;
    border-bottom: 1px solid #DDDDDD;

    >span,
    >div {
        display: inline-block;
        vertical-align: top;
        text-align-last: initial;
        text-align: left;
        font-size: 14px;
        line-height: 19px;
        @extend .i_word;

        span {
            margin-right: 10px;
        }
    }

    >span {
        width: 100px;

    }

    >div {
        width: 480px;

        >strong {
            color: #999999;
        }
    }

    &:last-of-type {
        margin-bottom: 0;
    }
}

.user_bgx {
    height: 722px;
    background: $bg_3;
    text-align: center;

    >i {
        margin: 150px 0 30px;
    }
}


.usetInfo_cb {
    text-align: center;
    font-size: 14px;
    color: $sc_5;

    >span {
        display: inline-block;
        margin-top: 300px;
    }
}

.communication {
    .router-link-exact-active {
        color: $sc_6
    }
}

.u_chat {
    height: 555px;

    .el-scrollbar {
        height: 100%;
    }

    ul {
        padding: 0 30px;
    }
}

.chatCont {
    padding-top: 25px;

    &:last-of-type {
        padding-bottom: 25px;
    }
}

.chatCont_time {
    text-align: center;
    padding-bottom: 20px;

    >span {
        font-size: 14px;
        color: $sc_1;
        line-height: 19px;
        background: #D8D8D8;
        border-radius: 2px;
        padding: 5px 7px;
        display: inline-block;
    }

    a {
        text-decoration: underline;
    }
}

.chatCont_txt {
    position: relative;

    >span {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        overflow: hidden;
        background: $bg_5;
        line-height: 40px;
        text-align: center;
        color: $sc_1;

        >img {
            width: 100%;
            height: 100%;
        }

    }

    .chatCont_t {
        max-width: 60%;
        @extend .i_word;
        padding: 8px 12px;
        font-size: 14px;
        line-height: 30px;
        background: #F8F8F8;
        border-radius: 3px;
        position: relative;
        margin-left: 25px;
        box-shadow: $shadow2;
        letter-spacing: 1px;
        // font-family: 'Segoe UI';

        &:before {
            content: " ";
            display: inline-block;
            width: 0;
            height: 0;
            overflow: hidden;
            line-height: 0;
            font-size: 0;
            vertical-align: middle;
            border-right: 7px solid #F8F8F8;
            border-left: 0 none;
            border-top: 7px solid transparent;
            border-bottom: 7px solid transparent;
            position: absolute;
            left: -7px;
        }

        img {
            width: 26px;
            height: 26px;
            margin: 0 2px;
        }

        .talk-img img {
            max-width: 180px;
            width: auto;
            height: auto;
        }
    }

    a {
        color: #348efd;
        text-decoration: underline;
    }

    .dataTime {
        color: #999;
        display: inline-block;
        margin: 10px;
        opacity: 0;
        transition: .2s;
    }

    &:hover {
        .dataTime {
            opacity: 1;
        }
    }
}

.is_active {
    .chatCont_txt {
        >span {
            float: none;
            float: right;
        }

        .chatCont_t {
            float: none;
            float: right;
            margin: 0 25px 0 0;
            background: #BCDBFF;

            &:before {
                left: initial;
                right: -7px;
                border-left: 7px solid #BCDBFF;
                border-right: 0 none;
                border-top: 7px solid transparent;
                border-bottom: 7px solid transparent;
            }
        }

        .dataTime {
            float: right;
        }
    }

    .chatCont_t {
        border: 0;
    }
}

.l_chat {
    text-align: center;
    text-align-last: justify;
    padding: 15px 25px;
    border-top: 1px solid #DDDDDD;
    position: relative;
    display: flex;
    flex-flow: row;

    .w-e-panel-container {
        top: -244px;
        left: 80%;
    }

    >div,
    >span>button {
        text-align: left;
        text-align-last: justify;
    }

    >.el-input {
        width: 480px;

        >input {
            height: 36px;
            line-height: 36px;
        }
    }

    >button {
        padding: 10px 20px;
    }

    .emoji_icon {
        width: 25px;
        height: 25px;
        cursor: pointer;
        margin-top: 4px;
    }

    .el-icon-close {
        position: absolute;
        z-index: 16;
        color: red;
        font-size: 24px;
        left: 650px;
        top: -210px;
        cursor: pointer;
    }

    #emoticonHend,
    .toolConten {
        display: inline-block;
        vertical-align: top;
    }

    .toolConten {
        width: 75%;
        border-radius: 4px;
        border: 1px solid #ddd;
        position: relative;

        .w-e-text-container {
            height: 40px !important;
            border: 0 !important;
        }

        .w-e-item {
            width: 22px;
            height: 22px;
            margin: 5px;
            display: inline-block;
            vertical-align: top;
        }

        .w-e-text {
            text-align: left;
            text-align-last: initial;
        }

        p {
            margin: 6px 0;
            line-height: 25px;
            font-size: 12px;
            letter-spacing: 1px;

            img {
                width: 25px;
                height: 25px;
            }
        }

        .w-e-icon-happy {
            font-size: 32px;
            color: #ffcf4a;

            &:hover {
                color: #FFEB3B !important;
            }
        }

        .w-e-toolbar {
            position: absolute;
            left: 103%;
            bottom: -3px;
            background: #fff !important;
            border: 0 !important;
            padding: 0;

        }



        .w-e-panel-tab-content {
            padding: 0 !important;
        }
    }

    .msg-btn {
        text-align: right;
        text-align-last: initial;

        button {
            height: 100px;
            background-color: #bcdbff;
            border-color: #bcdbff;

        }

        .submit {
            background-color: #348efc;
            border-color: #348efc;
        }
    }

    .txt-content {
        height: 100px;
        text-align-last: left;
        width: 530px;
        margin-right: 30px;
        z-index: 3;

        .w-e-panel-container {
            top: -264px;
            left: 149px;
            border: 0;
        }

    }


}

.opon_emoji {
    position: absolute;
    top: 22px;
    right: 130px;

    >span {
        cursor: pointer;
    }

    .emoji_icon {
        width: 23px;
    }
}

.emoji_wrap {
    position: absolute;
    bottom: 68px;
    right: 0px;
    width: 300px;
    height: 300px;
    background: $bg_3;
    box-shadow: $shadow;
    overflow: hidden;
    overflow-y: auto;

    h5 {
        padding: 10px;
    }

    >div {
        &:first-of-type {
            display: none;
        }
    }
}

.emoji_list {
    span {
        font-size: 20px;
        line-height: normal;
        cursor: pointer;
        padding: 4px;
        border-radius: 4px;

        &:hover {
            background: #eee
        }
    }
}

.u_resource {
    background: $bg_3;
    padding: 30px 40px 60px;
    margin-bottom: 40px;
    min-height: 580px;
    box-shadow: $shadow;
    border-radius: 0 0 5px 5px;

    .cate_id {

        .el-select {
            width: 180px;
        }

    }
}

.u_resourceH {
    padding-bottom: 30px;
}

.u_resourceH_l {
    font-size: 0;

    >a,
    button,
    input {
        height: 36px;
        line-height: 36px;
        font-size: 14px;
        padding: 0;
    }

    >a {
        background: $bg_1;
        border-radius: 3px;
        display: inline-block;
        vertical-align: top;
        width: 80px;
        text-align: center;
        color: $sc_1;
        margin-right: 10px;
    }

    >button {
        background: #E8F2FF;
        border-radius: 3px;
        color: #6A7FBC;
        width: 80px;
        margin-right: 10px;
        border: 0;
    }

    input {
        text-indent: 12px;
    }
}

.u_resourceH_r {
    width: 320px;

    .el-input__icon {
        font-size: 18px;
    }

    .el-input__suffix {
        background: $bg_1;
        right: 0;
        width: 44px;
        color: $sc_1;
        border-radius: 0 3px 3px 0;
    }

    .el-input__inner {
        border-radius: 3px;
    }
}

.el-select {
    border-radius: 3px;
}


.resourceLs {
    border-bottom: $bd_1;
    padding: 20px;

    .resource_icon {
        max-width: 55px;
        height: 50px;
        overflow: hidden;
        margin-top: 10px;

        >img {
            width: 100%;
        }
    }

    .resource_txt {
        margin-left: 75px;
    }

    .resource_link {
        height: 21px;
        margin-bottom: 20px;

        >a {
            display: inline-block;
            vertical-align: top;
            max-width: 60%;
            @extend .i_text;
            font-size: 16px;
            font-weight: bold;
            line-height: 21px;

            &:hover {
                color: $sc_6;
            }
        }
    }

    .resource_info {
        font-size: 14px;

        >button {
            width: 50px;
            height: 26px;
            // line-height: 26px;
            color: $sc_1;
            outline: none;
            border: 0;
            border-radius: 3px;
            text-align: center;
            cursor: text;
            font-size: 12px;
            margin: 0;
            padding: 0 !important;
            margin-right: 20px;
        }

        >span {
            color: #888888;
            margin-right: 20px;
            display: inline-block;
            vertical-align: top;
            line-height: 26px;

            &:before {
                content: '';
                border-left: $bd_3;
                padding-right: 20px;
                height: 10px;
            }
        }

        .r_state1 {
            background: #3BB080;
            // width: auto;
            // height: auto;
        }

        .r_state2 {
            background: #E2AE26;
        }

        .r_state3 {
            background: #239BD0;
        }

        .a_state1 {
            background: #67c23a;
        }

        .a_state2 {
            background: #e6a23c;
        }

        .a_state3 {
            background: #f56c6c;
        }
    }

    .resource_state {
        >.r_state1 {
            width: 50px;
            height: 26px;
        }
    }

    .log {
        margin-bottom: 0;
    }

    &:first-of-type {
        border-top: $bd_1;
    }
}



.resource_ioperation {
    min-width: 100px;
    position: relative;
    text-align: right;
    height: 21px;
    line-height: 21px;

    >span {
        font-size: 12px;
        color: #888888;

        &:first-of-type {
            margin-right: 15px;
        }

        ;
    }

    >a {
        margin: 0 5px 0 25px;
        font-size: 14px;
        color: #406596;
    }

    .lock_icon {
        width: 20px;
        margin-right: 10px;
    }

    .el-icon-arrow-down {
        font-size: 16px;
        color: #888;

        &:before {
            content: "\e794"
        }
    }
}

.ioperation_hover {
    padding: 10px 0;
}

.r_ioperation {

    width: 160px;

    >li {
        font-size: 14px;
        cursor: pointer;
        line-height: 40px;
        text-align: center;

        >a {
            display: block;
            color: #606266;
        }

        &:hover {
            background: #E8F2FF;
        }
    }

    >div {
        >span {
            margin-left: 20px;
            cursor: pointer;
        }

        >a {
            margin-left: 8px;
        }
    }
}

.chart {
    width: 100%;
    height: 250px;

    .echarts {
        width: 100%;
        height: 100%;
    }
}

.chartBox {
    .el-dialog__body {
        display: none;
    }
}

.el-dialog .el-dialog__header {
    background: $bg_1;
    padding: 10px 20px;

    .el-dialog__title {
        font-size: 14px;
        color: #FFFFFF;
    }

    .el-dialog__close {
        color: #FFFFFF;

        &:hover {
            color: #FFFFFF;
            opacity: 1;
        }
    }

    .el-dialog__headerbtn {
        top: 12px;
        font-size: 20px;
    }

    .el-dialog__footer {
        padding: 40px 20px 0;
    }
}

.r_file {
    width: 80px;
    height: 36px;
    background: $bg_1;
    border-radius: 3px;
    line-height: 36px;
    color: $sc_1;
    text-align: center;
    font-size: 14px;
    cursor: pointer;

}

.r_typeClass {
    >div {
        display: inline-block;
        vertical-align: top;
        width: 280px;
        margin-right: 20px;

        &:nth-of-type(3n) {
            margin: 0 0 22px 0;
        }
    }
}

.r_submitBox {
    text-align: left;
}


.editoH {
    padding-top: 20px;

    input {
        text-align: center;
        font-size: 20px;
        border-radius: 0;
        border: 1px solid #ccc;
        height: 60px;
        border-bottom: 0;

        &::-webkit-input-placeholder {
            font-size: 20px;
        }
    }
}

.edito {
    .ql-toolbar {
        background: #eee;
    }

    .ql-editor {
        min-height: 400px;
        max-height: 400px;
    }

    .el-form-item {
        margin: 0;
    }

    .el-form-item__label {
        text-align: left;
    }

    .ql-formats {
        .ql-list {
            display: none;
        }

    }

}


.editoB {
    padding-top: 30px;
}


.editoB_l {
    line-height: 30px;
    font-size: 14px;

    >span {
        margin-right: 30px;
    }
}


.j_detailsH {
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    padding: 30px 0;
}

.j_details_txt {
    font-size: 14px;
    line-height: 28px;

    p {
        @extend .i_word;
    }

    a {
        color: #348efc;
        text-decoration: underline;
    }
}

.j_details {
    min-height: 500px;
}

.j_details_mp {
    font-size: 12px;
    color: $sc_5;
    line-height: 19px;
    padding: 10px 0 20px;

    >span {
        margin-right: 20px;
    }
}

.roomP {
    background: $bg_3;
    padding: 25px 55px 65px 60px;
    margin-bottom: 20px;
    box-shadow: $shadow2;
    border-radius: 3px;

    >a,
    >span {
        display: block;
        width: 100px;
        height: 100px;
        border-radius: 50%;
        overflow: hidden;
        display: block;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    .roomP_r {
        margin-left: 150px;
    }
}


.roomP_user {
    height: 40px;

    >div {
        &:nth-of-type(1) {
            float: left;

            >h3,
            >span {
                display: inline-block;
                vertical-align: top;
            }

            >h3 {
                font-size: 20px;
                color: #000000;
                line-height: 22px;
            }

            >span {

                font-size: 14px;
                color: #FFFFFF;
                line-height: 19px;
                background: #348EFC;
                border-radius: 100px;
                padding: 3px 12px;
                margin-left: 15px;

            }
        }

        &:nth-of-type(2) {
            float: right;

            >a,
            >span {
                display: inline-block;
                vertical-align: top;
                background: #64cdff;
                border-radius: 100px;
                width: 100px;
                height: 40px;
                line-height: 40px;
                font-size: 12px;
                color: $sc_1;
                margin-left: 20px;
                cursor: pointer;

                >i {
                    margin: 0 10px 0 10px;
                }

                &:nth-of-type(2) {
                    background: #ff9c9d;
                    color: $sc_1
                }
            }

            .is_follow {
                background: #f9bcbd;
            }
        }
    }
}

.roomP_info {
    margin: 20px 0 30px;

    >span {
        font-size: 14px;
        color: $sc_4;
        margin-right: 60px;

        &:last-of-type {
            margin-right: 0;
        }
    }
}

.roomP_synopsis {
    height: 40px;
    overflow: hidden;

    >p {
        @extend .i_word;
        font-size: 14px;
        color: #000000;
        line-height: 19px;
    }
}

.room_content {
    text-align: center;
    text-align-last: justify;
    margin-bottom: 60px;

    >div {
        text-align-last: initial;
        text-align: left;
    }
}

.room_lk {
    width: 200px;
    background: $bg_3;
    padding: 10px 0;

    >a {
        display: block;
        height: 60px;
        line-height: 60px;
        padding: 0 0 0 20px;
        font-size: 14px;
        position: relative;

        >i {
            &:nth-of-type(1) {
                margin-right: 10px;
                vertical-align: middle;
            }

            &:nth-of-type(2) {
                position: absolute;
                top: 20px;
                right: 20px;
                opacity: 0;
            }
        }
    }

    .router-link-active {
        background: #E8F2FF;

        >.Shape_04 {
            opacity: 1;
        }
    }
}

.room_cr {
    width: 760px;
}

.i_hotListD {
    width: 240px;
    max-height: 300px;
    background: $bg_3;
    border-radius: 3px;
    overflow: hidden;
    margin: 0 20px 20px 0;
    @extend .i_transition;
    box-shadow: $shadow2;

    >a {
        display: block;
        height: 120px;
        overflow: hidden;
        display: block;

        >img {
            width: 100%;
            height: 100%;
        }

    }

    .i_uClassTxt {
        padding: 10px 10px 20px;

        >a {
            display: block;
            font-size: 14px;
            line-height: 19px;
            @extend .i_text
        }
    }

    .i_hotType2 {
        line-height: 25px;
        font-size: 12px;
        margin-top: 15px;

        >a {
            &:nth-of-type(1) {
                >span {
                    display: inline-block;
                    vertical-align: middle;
                    width: 25px;
                    height: 25px;
                    -moz-border-radius: 50%;
                    border-radius: 50%;
                    overflow: hidden;

                    >img {
                        width: 100%;
                        height: 100%;
                    }
                }
            }
        }
    }

    .i_hCollect {
        color: #888;
    }

    &:nth-of-type(3n) {
        margin: 0 0 20px 0;
    }

    &:hover {
        box-shadow: $shadow;

        .i_uClassTxt>a {
            color: $sc_6;
        }
    }

}

.xin_icon {
    width: 20px;
    margin-top: 2px;
}


.i_hResourcesLsD {
    width: 220px;
    height: 140px;
    background: #ffffff;
    padding: 10px 12px;
    box-shadow: $shadow2;
    border-radius: 3px;
    margin: 0 14px 15px 0;

    .i_hResourcesT {
        >a {
            display: block;
            float: left;
            font-size: 16px;
            line-height: 24px;
            width: 74%;
            height: 48px;
            @extend .i_word;
            overflow: hidden;
        }
    }

    .i_hCollect {
        line-height: 22px;
    }

    .i_hResourcesS {
        margin: 30px 0 15px;
    }

    .i_rUser {
        >a {
            display: inline-block;
            line-height: 25px;
            font-size: 12px;

            >span {
                display: inline-block;
                vertical-align: middle;
                width: 25px;
                height: 25px;
                border-radius: 50%;
                overflow: hidden;

                >img {
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }

    .i_hScore {
        >div {
            display: inline-block;
            vertical-align: top;
        }

        >i {
            line-height: 20px;
            color: rgb(247, 186, 42);
        }
    }

    &:nth-of-type(3n) {
        margin: 0 0 15px 0;
    }
}

.i_log {
    background: $bg_3;
    padding: 20px;
    border-bottom: $bd_1;

    >a {
        float: left;
        display: block;
        font-size: 14px;
        @extend .i_text;
        max-width: 70%;
        line-height: 19px;
    }

    >i {
        float: right;
        font-size: 12px;
        color: $sc_5;
    }
}

.i_teacherLs {
    width: 243px;
    height: 250px;
    background: $bg_3;
    box-shadow: $shadow2;
    overflow: hidden;
    margin: 0 15px 15px 0;
    text-align: center;

    .i_teacherLs_b {
        >a {
            display: inline-block;
            vertical-align: top;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            overflow: hidden;
            background: #effaff;
            margin: 0 0 25px;
            margin-top: 40px;

            >img {
                width: 100%;
                height: 100%;
            }
        }

        >h3 {
            font-size: 18px;
            line-height: 24px;
            margin-bottom: 20px;
            font-weight: bold;
        }

        >div {
            font-size: 14px;
            line-height: 19px;
            overflow: hidden;
        }

        >p {
            font-size: 14px;
            line-height: 19px;
            color: #999999;
        }
    }

    &:nth-of-type(3n) {
        margin: 0 0 15px 0;
    }

    &:hover {
        .i_teacherLs_t {
            opacity: 1;
            visibility: visible;
        }
    }
}

.i_teacherLs_t {
    text-align: center;
    position: relative;
    height: 100%;
    transform: translate3d(0, -83%, 0);
    background: #ffffff;
    visibility: hidden;
    opacity: 0;

    >h3 {
        font-size: 18px;
        line-height: 24px;
        padding: 40px 0 20px;
        font-weight: bold;
        @extend .i_text;
        height: 20px;
    }

    >div {
        font-size: 14px;
        line-height: 19px;
        margin-bottom: 30px;
    }

    >p {
        font-size: 14px;
        line-height: 19px;
        color: #999999;
        margin-bottom: 30px;
    }

    .i_brief {
        font-size: 14px;
        line-height: 19px;
        padding: 0 30px;
        overflow: hidden;
        text-align: center;
        height: 40px;
        @extend .i_text
    }

    .i_teacherLs_m {
        margin: 0;
        background: #338efc;
        padding: 5px 0;
        position: absolute;
        bottom: 0;
        width: 100%;
        text-align: center;
        text-align-last: justify;

        >i {
            cursor: pointer;
            margin: 0 15px;
        }
    }
}






.type_val {
    width: 100px;
    height: 30px;
    line-height: 30px;
    margin-left: 40px;

    .el-input__inner {
        height: 30px;
        line-height: 30px;
        font-size: 12px;
        border-radius: 0;
        color: $sc_2;
    }
}


.notice_cont {
    margin-bottom: 60px;
}

#collection {
    text-align: center;
    text-align-last: justify;
    margin: 30px auto 80px;

    >div {
        text-align-last: initial;
        text-align: left;
    }
}



.class_cont {
    width: 780px;
    background: $bg_3
}


.classLs {
    padding: 25px 0;
    border-bottom: $bd_1;

    >a {
        display: block;
        background: #E8F2FF;
        border: 1px solid #D3ECFF;
        width: 160px;
        height: 90px;
        float: left;
        @extend .i_transition;

        >img {
            width: 100%;
            height: 100%;
        }

        &:hover {
            box-shadow: $shadow;
        }
    }

    >span {
        display: block;
        float: left;
        max-width: 60px;
        max-height: 50px;
        overflow: hidden;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    &:first-of-type {
        border-top: $bd_1;
    }
}

.classLs_info {
    margin-left: 180px;

    .classLs_1 {
        height: 21px;
        margin-bottom: 20px;

        >a {
            display: block;
            float: left;
            max-width: 60%;
            @extend .i_text;
            font-size: 16px;
            color: #000000;
            font-weight: bold;
            line-height: 21px;

            &:hover {
                color: $sc_6;
            }
        }

    }
}

.classLs_2 {
    margin-bottom: 15px;

    >strong {
        font-size: 14px;
        color: #6A87AC;
        margin-right: 20px;

        &:after {
            display: inline-block;
            content: '';
            border-right: $bd_1;
            height: 12px;
            padding-left: 15px;
        }
    }

    >span {
        font-size: 12px;
        color: $sc_4;
        background: #E9E9E9;
        padding: 4px 7px;
        margin-right: 10px;
    }
}

.classLs_3 {
    font-size: 12px;
    color: #888888;
    @extend .i_text;
    line-height: 19px;
}

.classLs_4 {
    font-size: 0;
    margin-bottom: 15px;

    >span {
        font-size: 14px;
        color: $sc_4;
        margin-right: 20px;
        display: inline-block;
        vertical-align: top;
        @extend .i_text;
        max-width: 120px;
        line-height: 20px;

        &:after {
            content: '';
            display: inline-block;
            vertical-align: middle;
            border-right: $bd_1;
            height: 12px;
            padding-left: 15px;
        }

        &:first-of-type {
            color: #EBA300;


        }

        &:last-of-type {
            margin-right: 0;

            &:after {
                padding: 0;
                display: none;
            }
        }
    }
}

.resource_g {
    margin-left: 80px;

    .classLs_4 {
        >span {
            &:first-of-type {
                color: #6A87AC;
            }
        }
    }

    >div {
        &:last-of-type {
            margin: 0;
        }
    }
}

.pageing,
.el-pagination {
    padding: 20px 0 20px;

    .el-pagination__sizes {}

    .el-pager {
        li {
            color: #6A87AC;
            padding: 0;
            min-width: 30px;
            font-size: 12px;
        }

        .number {
            background: #F0F2F5;
            border-radius: 2px;
            margin: 0 4px;
            width: 24px;
            height: 24px;
            line-height: 24px;
            padding: 0;
            min-width: 20px;
        }

        .active {
            color: $sc_1;
            background: $bg_1;
        }
    }

    .btn-prev,
    .btn-next {
        background: #F0F2F5;
        border-radius: 2px;
        width: 24px;
        height: 24px;
        line-height: 24px;
        padding: 0;
        min-width: 20px;
    }

    .el-pagination__total,
    .el-pagination__jump {
        color: #6A87AC;
    }

    .el-input__inner {
        border: 1px solid #D5EAFB;
        border-radius: 0;
    }
}


.u_resourceK {
    font-size: 14px;
    margin-bottom: 30px;

    >a {
        margin-right: 40px;
        line-height: 19px;
    }
}

.test2 {
    background: $bg_3;

    .classH {
        padding-bottom: 30px;
    }

    .i_testTxt {
        padding: 0 !important;
    }
}

.i_choiceT {
    background: #EFF6FF;
    height: 36px;
    line-height: 36px;
    padding: 0 30px;
    font-size: 12px;

    .i_choiceT_l {
        >span {
            color: #333333;
            float: left;
            position: relative;

            &:after {
                content: '';
                display: inline-block;
                vertical-align: middle;
                width: 1px;
                height: 10px;
                background: #979797;
                margin: 0 20px;
            }

            &:last-of-type {
                &:after {
                    display: none;
                }
            }
        }
    }

    .i_choiceT_r {
        .bcxc {
            color: #348efc;
            margin-left: 30px;
            cursor: pointer;
        }
    }
}

.i_choiceC {
    padding: 20px;
    position: relative;
}

.i_testTxt {
    font-size: 14px;
    line-height: 30px;
    padding: 0 10px;

    >img {
        max-width: 94%;
    }

    >strong {
        position: absolute;
        right: 30px;
    }
}

.i_choiceLs {
    @extend .i_testTxt;

    >label {
        cursor: default;
        float: left;

        >input {
            display: none;
        }
    }
}

.i_analysisBox {
    z-index: 2;

    .i_analysis {
        line-height: 30px;
        font-size: 14px;

        >span {
            display: block;
            float: left;
            width: 60px;
            color: #666666;
        }

        >div {
            font-size: 14px;
            margin-left: 80px;
            word-wrap: break-word;
            word-break: break-all;
        }
    }
}

.analyP {
    padding: 20px 40px;
    max-height: 500px;
    overflow: hidden;
    overflow-y: auto;
}

#classSpace {
    padding: 30px 40px;
    display: flex;
    justify-content: space-between;
}

.classSpace_link {
    width: 260px;

    .menuLk {
        width: 100%;
    }
}

.classSpace_h {
    background: $bg_3;
    padding: 20px 20px 30px;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    border-radius: 3px;
    ;
}

.classSpace_h1 {
    text-align: center;
    text-align-last: justify;

    >i,
    >div {
        display: inline-block;
        vertical-align: middle;
        text-align-last: initial;
        text-align: left;
    }
}

.classSpace_hc {
    width: 130px;

    .el-input__inner {
        border: 0;
        font-weight: bold;
        padding-right: 10px;
    }

    .el-input__suffix {
        right: 0;
    }
}

.classSpace_h2 {
    margin-top: 30px;

    >span {
        font-size: 14px;
        color: #000000;
        display: block;
        width: 130px;
        overflow: hidden;
        height: 20px;
        line-height: 20px;
        @extend .i_text;
        float: left;

        &:last-of-type {
            margin: 0;
            width: 80px;
            float: right;
        }
    }
}

.classSpace_hk {
    width: 100%;
}

.classSpace_cont {
    width: calc(720px - 80px);
    background: $bg_3;
    padding: 20px 40px 60px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    border-radius: 3px;
    min-height: 450px;
}


.classIndex_h {
    margin-bottom: 30px;

    >span {
        font-size: 14px;
        line-height: 19px;

        >i {
            padding: 0 10px;
            font-family: "Simsun";
        }
    }

    >a {
        font-size: 14px;
        line-height: 19px;
        color: #999;

        >i {
            padding: 0 10px;
            font-family: "Simsun";
        }
    }

    >strong {
        font-size: 14px;
        line-height: 19px;
        color: #333;

        >i {
            color: #999;
            padding: 0 10px;
            font-family: "Simsun";
        }
    }

    >em {
        font-size: 14px;
        line-height: 19px;
        color: #999;
        cursor: pointer;
    }
}


.classCircle_txt {
    margin-bottom: 50px;

    >div {
        &:nth-of-type(1) {
            margin: 10px 0 15px;
        }

        &:nth-of-type(2) {
            position: relative;

            .el-textarea__inner {
                border-radius: 0;
            }

            >span {
                position: absolute;
                bottom: 5px;
                right: 11px;
                font-size: 14px;
                color: $sc_5;
                display: inline-block;
                padding: 5px;
                background: #fff;
                z-index: 3;

                >i {
                    color: #3A3A3A;
                }
            }
        }

        &:nth-of-type(3) {
            margin-top: 20px;
            position: relative;

            .avatar-uploader {
                span {
                    line-height: 36px;
                    cursor: pointer;

                    .svg-icon {
                        margin-right: 5px;
                    }
                }
            }
        }
    }

}

.uploader_om {
    display: inline-block;

    .uploader-btn {
        padding: 0;
    }
}

.authority_ll {
    .el-button {
        padding: 0;
        width: 60px;
        height: 30px;
        line-height: 30px;
        text-align: center;
    }

    .el-select {
        width: 50px;

        .el-input__inner {
            padding: 0;
            border: 0;
            line-height: 30px;
            height: 30px;
            font-size: 12px;
        }

        .el-input__icon {
            line-height: 30px;
            font-size: 12px;
        }
    }
}

.classCircle_title {
    padding-bottom: 10px;
    border-bottom: 1px solid #DDDDDD;

    >span {
        font-size: 16px;
        font-weight: bold;
        line-height: 21px;
    }
}


.class_private {

    label {
        line-height: 21px;
        margin: 0;

        .el-radio__input {
            display: none;
        }

        .el-radio__label {
            display: inline-block;
            vertical-align: top;
            font-size: 12px;
            color: #666666;
            margin-left: 12px;
            position: relative;
            cursor: pointer;
            padding: 0;

            &:after {
                content: '';
                display: inline-block;
                height: 4px;
                width: 100%;
                background: $sc_1;
                bottom: -10px;
                position: absolute;
                left: 0;

            }
        }
    }

    .el-radio+.el-radio {
        margin: 0;
    }

    .is-checked {
        .el-radio__label {
            &:after {
                background: $sc_6;
            }
        }
    }
}

.classTeest_1 {
    padding: 20px 0 10px;
    border-bottom: 1px solid #ddd;

    >a {
        display: block;
        float: left;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        overflow: hidden;
        background: $bg_5;
        text-align: center;

        >span {
            color: #666;
            line-height: 40px;
        }

        >img {
            width: 100%;
            height: 100%;
        }
    }
}

.classTeest_1r {
    margin-left: 60px;
}

.trash {
    color: $sc_6;
    cursor: pointer;
    font-size: 14px;
    opacity: 0;
    visibility: hidden;
    @extend .i_transition;
}

.classCircle_ls {
    &:hover {
        .trash {
            opacity: 1;
            visibility: visible;
        }
    }
}

.trash_time {
    font-size: 12px;
    color: #999;
    display: inline-block;
    width: 100px;
    text-align: right;
}

.trash_private {
    font-size: 12px;
    color: #999;
    margin-left: 15px;
}


.no_answer {
    line-height: 30px;
    color: #999;
}

.classTeest_r2 {
    line-height: 19px;

    >a {
        font-size: 14px;
        color: #6A87AC;
    }

    >span {
        font-size: 12px;
        color: #666666;
    }
}

.classTeest_rT {
    font-size: 16px;
    line-height: 24px;
    @extend .i_word;
    color: $sc_2;

    >img {
        width: 27px;
        height: 27px;
    }

    img[data-w-e] {
        width: 26px;
        height: 26px;
    }


    .emoji {
        width: 26px !important;
        height: 26px !important;
        background: none;
    }
}


.classTeest_rP {
    text-align: right;
    position: relative;
    min-height: 42px;
    margin: 15px 0 0;

}

.classTeest_opc {
    position: relative;
    right: 0;
    display: inline-block;
    margin-top: 10px;

    >i {
        margin-left: 20px;
        vertical-align: middle;
        cursor: pointer;
    }

    >span {
        font-size: 14px;
        cursor: pointer;
    }
}

.class_zan1 {
    color: #abbfdb
}

.class_zan2 {
    color: #edb22e
}

.classTeest_rZ {
    background: #F6F6F6;
    ;
    border-radius: 3px;
    padding: 15px;
    position: absolute;
    right: 100px;
    text-align: left;

    >span {
        padding: 3px 5px;
    }

    &:before {
        content: " ";
        display: inline-block;
        width: 0;
        height: 0;
        overflow: hidden;
        line-height: 0;
        font-size: 0;
        vertical-align: middle;
        border-left: 8px solid #F6F6F6;
        border-right: 0 none;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        position: absolute;
        top: 15px;
        right: -8px;
    }
}

.classTeest_rPl {
    transition: .5s;

    >ul,
    .classTeest_rTx {
        background: #F7F7F7;
        padding: 15px 20px;
        border-radius: 5px;
    }

    >ul {
        margin-top: 20px;
    }

    >div {
        margin-top: 10px;
    }
}



.classTeest_rPT {
    position: relative;

    >span {
        position: absolute;
        bottom: 10px;
        right: 20px;
        color: $sc_5;

        >i {
            color: $sc_2;
        }
    }

    textarea {
        border-radius: 0;
    }

    >div {
        background: #fff;
    }
}

.classTeest_rPB {
    text-align: right;
    padding: 15px 0 0;

    >button {
        border: 0;
        padding: 0;
        width: 60px;
        height: 30px;
        line-height: 30px;
        text-align: center;
    }
}

.classTeest_PlS_l {
    >a {
        display: inline-block;
        vertical-align: top;
        width: 40px;
        height: 40px;
        overflow: hidden;
        border-radius: 50%;
    }
}


.classTeest_PlS_lt {
    margin-left: 5px;
    display: inline-block;
    vertical-align: top;

    >div {
        line-height: 19px;
        @extend .i_text;
        max-width: 134px;

        i {
            color: #999999;
        }

        &:nth-of-type(1) {
            span {
                margin-left: 10px;
            }

            >a {
                font-size: 14px;
                color: #6A87AC;
            }
        }

        &:nth-of-type(2) {
            font-size: 12px;
            margin-top: 8px;

            >span {
                color: #999999;
            }
        }
    }
}

.classTeest_PlS {
    margin-top: 20px;

    .el-icon-delete,
    .banjiquan_pinglun {
        font-size: 18px;
        color: #999;
        cursor: pointer;
        float: left;
        margin-left: 20px;
        opacity: 0;
        visibility: hidden;
        @extend .i_transition;
    }

    &:hover {

        .el-icon-delete,
        .banjiquan_pinglun {
            opacity: 1;
            visibility: visible;
        }
    }
}


.teach-open {
    // text-align: right;
    margin-top: 20px;

    span {
        cursor: pointer;
        color: #999
    }
}

.classTeest_PlS_r {
    margin-left: 20px;
    border-radius: 4px;
    background: #E7F5FF;
    font-size: 14px;
    padding: 10px;
    min-height: 20px;
    color: #3377AA;
    @extend .i_word;
    max-width: 75%;
    line-height: 22px;
    position: relative;
    box-shadow: $shadow2;

    &:before {
        content: " ";
        display: inline-block;
        width: 0;
        height: 0;
        overflow: hidden;
        line-height: 0;
        font-size: 0;
        vertical-align: middle;
        border-right: 8px solid #E7F5FF;
        border-left: 0 none;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        position: absolute;
        left: -8px;
    }
}


.classTeest_box {
    >a {
        display: block;
        float: left;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        overflow: hidden;
        transition: .2s;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    >span,
    >i {
        float: right !important;
    }

    &:hover {
        transition: .2s;

    }

    >button {
        opacity: 0;
        visibility: hidden;
    }

    &:hover {
        >button {
            opacity: 1;
            visibility: visible;
        }
    }

}

.classTeest_reply {
    margin-left: 40px;
}

.classTeest_reply_name {
    line-height: 30px;

    >span {
        color: $sc_6;
    }

    >strong {
        color: #999;
        margin-left: 20px;
    }

    .user_Reply {
        >i {
            color: #999;
            margin-right: 6px;
        }
    }
}

.classTeest_opt {
    opacity: 0;
    visibility: hidden;
    @extend .i_transition;

    >i {
        font-size: 18px;
        color: #abbfdb;
        margin-left: 10px;
    }
}

.classTeest_reply_txt {
    margin: 8px 0 10px;
    line-height: 19px;
    color: #666;
    @extend .i_word;

    .emoji {
        width: 26px !important;
        height: 26px !important;
        background: none;
    }
}

.classTeest_PlS {
    &:hover {
        .classTeest_opt {
            visibility: visible;
            opacity: 1;
        }
    }
}

.upload_M {
    .el-upload-list {
        font-size: 0;
        margin-top: 20px;

        li {
            display: inline-block;
            vertical-align: top;
            padding: 0;
            width: 240px;
            height: 120px;
            border-radius: 0;
            margin: 0 10px 10px 0;

            >img {
                margin: 0;
                width: 100%;
                height: 100%;
            }

            >a {
                display: none;
            }

            >label {
                z-index: 3;
            }

            .el-icon-close {
                z-index: 3;
                padding: 5px;
                background: #A49CED;
                color: $sc_1;
                top: 0;
                right: 0;
            }
        }
    }

    span {
        line-height: 36px;

        .svg-icon {
            margin-right: 5px;
        }
    }
}

.classCircle_bg {
    text-align: center;
    padding: 80px 0 100px;

    >p {
        margin-top: 30px;
        font-size: 14px;
        color: $sc_5
    }
}

.classNotice_search {
    margin-bottom: 20px;
    height: 36px;
    display: flex;
    justify-content: space-between;

    .classNotice_sc {
        width: 320px;
    }

    .el-input__prefix {
        left: initial;
        right: 0;
        background: $bg_1;
        border-radius: 0 3px 3px 0;
        overflow: hidden;
    }

    .el-input__icon {
        width: 44px;
        color: $sc_1;

    }

    .el-input__inner {
        line-height: 36px;
        height: 36px;
    }

    .el-input--prefix .el-input__inner {
        padding-left: 0;
        text-indent: 12px;
        border-radius: 3px;
    }

    >a {
        display: block;
        width: 80px;
        height: 36px;
        background: $bg_1;
        border-radius: 3px;
        text-align: center;
        line-height: 36px;
        color: $sc_1;
        font-size: 14px;
    }
}

.classNotice-op {
    justify-content: flex-end;

    a {
        margin-left: 20px;
    }
}



.classNotice_ls {
    padding: 20px;
    border-bottom: $bd_3;

    &:first-of-type {
        border-top: $bd_3;
    }
}

.classNotice_ls1 {
    margin-bottom: 20px;

    >a,
    >p {
        display: inline-block;
        vertical-align: top;
        max-width: 60%;
        @extend .i_text;
        font-weight: bold;
        line-height: 21px;
        font-size: 16px;
    }

    >span {
        float: right;
        font-size: 12px;
        color: #888888;

        >i {
            margin-left: 5px;
        }
    }
}

.classNotice_ls2 {
    margin-bottom: 20px;

    >div {
        float: left;
        display: inline-block;
        vertical-align: top;
        max-width: 70%;
        @extend .i_text;
        font-size: 14px;
        line-height: 19px;
    }

    >span {
        font-size: 14px;
        color: #348EFC;
        float: right;
        cursor: pointer;
    }

    .classNotice-del {
        color: red;
        margin-left: 20px;
    }
}

.classNotice_ls3 {
    font-size: 0;

    >span {
        display: inline-block;
        vertical-align: top;
        line-height: 40px;
        margin-right: 30px;
        font-size: 12px;

        &:nth-of-type(1) {
            color: #666666;

            >span {
                display: inline-block;
                vertical-align: middle;
                width: 30px;
                height: 30px;
                border-radius: 50%;
                overflow: hidden;
                margin-right: 5px;

                >img {
                    width: 100%;
                    height: 100%;
                }
            }
        }

        &:nth-of-type(2) {
            color: #6A87AC;
            cursor: pointer;

            .see_icon {
                width: 20px;
                vertical-align: text-bottom;
            }
        }
    }
}

.el-scrollbar {
    height: 100%;
}

.el-dialog__body {
    padding: 0;
}

.people {
    height: 500px;
    padding: 30px 70px 60px;

    .people_yh {
        >span {
            color: #6A87AC;
            line-height: 19px;
        }

        >label {
            margin-right: 40px;

            >input {
                display: none;
            }

            >input:checked+span {
                color: $sc_6;
            }
        }
    }

    .people_ym {
        >li {
            float: left;
            font-size: 12px;
            margin: 20px 20px 0 0;
            width: 60px;
            overflow: hidden;
            text-align: center;

            >div {
                width: 40px;
                height: 40px;
                border-radius: 50%;
                overflow: hidden;
                background: $bg_1;
                text-align: center;
                line-height: 40px;
                color: $sc_1;
                display: inline-block;

                >img {
                    width: 100%;
                    height: 100%;
                }
            }

            >p {
                text-align: center;
                line-height: 16px;
                margin-top: 6px;
                height: 21px;
                line-height: 21px;
                @extend .i_text;
            }

            &:nth-of-type(9n) {
                margin: 20px 0 0 0;
            }
        }
    }

    .people_hr {
        border-bottom: 1px dashed #DDDDDD;
        margin: 20px 0;
    }

    .people_ac {
        margin-bottom: 20px;

        >span {
            color: #6A87AC;
            line-height: 19px;
        }

        >label {
            margin-right: 40px;

            >input {
                display: none;
            }

            >input:checked+span {
                color: $sc_6;
            }
        }
    }
}



.detailsNT {
    padding: 40px 30px 60px;

    h2 {
        font-size: 18px;
        font-weight: bold;
        line-height: 24px;
        text-align: center;
        margin-bottom: 20px;
    }

    p {
        color: #888888;
        text-align: center;
    }

    .detailsNT_cx {
        font-size: 14px;
        line-height: 22px;
        margin: 40px 0;
        @extend .i_word;
    }

    .detailsNT_wx {
        background: #F5F5F5;
        padding: 25px 20px 25px 40px;

        >div {
            float: left;

            span {
                display: inline-block;
                vertical-align: middle;
                margin-right: 5px;
            }

            strong {
                font-size: 12px;
                display: inline-block;
                max-width: 200px;
                @extend .i_text;
            }
        }

        >a {
            float: right;
            color: $sc_6;
            font-size: 14px;
            line-height: 38px;
        }
    }

    .detailsNT_img {
        text-align: center;
    }
}


.classIndex_lk {
    margin-bottom: 30px;

    >a {
        font-size: 14px;
        color: #000000;
        line-height: 19px;
        cursor: pointer;

        >i {
            padding: 0 8px;
            color: #000000;
        }

        &:last-of-type {
            color: $sc_5;
        }
    }

    >strong {}
}

.sendNotice_btn {
    margin-top: 60px;
    text-align: left;
}


.achievement_type {
    line-height: 36px;

    >a {
        margin-right: 40px;
        font-size: 14px;
        color: $sc_4;
    }

    .router-link-exact-active {
        color: $sc_6;
    }

    >label {
        >input {
            display: none;
        }

        >input:checked+span {
            color: $sc_6;
        }
    }

    span {
        margin-right: 40px;
        cursor: pointer;
        font-size: 14px;
        color: $sc_4;
    }

    .showActive,
    .isActive {
        color: $sc_6;

    }
}

.achievement_ls {
    padding: 20px 0;
    border-bottom: $bd_3;

    >a {
        font-size: 16px;
        font-weight: bold;
        line-height: 21px;
    }

    &:first-of-type {
        border-top: $bd_3;
    }
}

.achievement_if {
    margin-top: 15px;

    >div {
        line-height: 19px;

        &:nth-of-type(1) {
            >span {
                font-size: 12px;
                margin-right: 30px;
            }
        }

        &:nth-of-type(2) {
            font-size: 14px;
            color: $bg_1;

            >a {
                color: $bg_1;
                margin-right: 30px;
            }

            >span {
                cursor: pointer;
            }
        }
    }
}

.Atemplate {
    background: #F5F5F5;
    padding: 25px 40px;

    .Atemplate_l {
        >span {
            display: inline-block;
            vertical-align: top;
            margin-right: 5px;
        }

        >strong {
            font-size: 14px;
            color: #008EFF;
        }
    }

    .Atemplate_r {
        width: 290px;
        font-size: 12px;
        color: $sc_4;
        line-height: 19px;
        @extend .i_word;
    }
}

.disadVal {
    >input {
        color: $sc_2 !important;
        border: 0 !important;
        background: none !important;
    }
}

// .el-input__inner{
//  border-radius: 0;
// }

.detailsAchievement_h {
    text-align: center;
    position: relative;

    >span {
        font-size: 18px;
        line-height: 24px;
    }

    >button {
        position: absolute;
        right: 0;
        font-size: 12px;
        color: $sc_6;
        background: none;
        outline: none;
        border: 0;
    }
}

.detailsAchievement_tabel {
    .el-table {
        margin-top: 30px;
    }
}



.el-message-box__wrapper .confirm-them {
    width: 400px;
    border-radius: 0;
    border: 0;
    padding-bottom: 20px;

    .el-message-box__header {
        background: $bg_1;
        padding: 15px;

        .el-message-box__title,
        .el-message-box__close {
            color: $sc_1;
        }
    }

    .el-message-box__header {
        display: block !important;
    }

    .el-message-box__content {
        padding: 60px 20px;
    }

    .el-message-box__btns {
        >button {
            padding: 0;
            border: 0;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;

            &:nth-of-type(1) {
                background: #DEEFFF;
                color: #7C9BB8;
            }
        }
    }
}

.classTK {
    .classTask_ls {
        width: 270px;
        padding: 30px 20px 0;

    }

    .classTask_l2_r>div {
        margin: 30px 0 55px 130px;
    }
}

.classTask_ls {
    width: 290px;
    height: 210px;
    border: $bd_1;
    padding: 30px 25px 0;
    position: relative;
    margin: 0 15px 15px 0;
    position: relative;
    @extend .i_transition;
    overflow: hidden;

    >h3 {
        font-size: 16px;
        color: #000000;
        line-height: 21px;
        font-weight: bold;
        @extend .i_text;
    }

    >i {
        color: #666;
    }

    .el-icon-sunny,
    .el-icon-lightning {
        position: absolute;
        top: 5px;
        right: 5px;
        font-size: 18px;
    }

    .el-icon-tickets,
    .el-icon-video-play,
    .el-icon-collection {
        position: absolute;
        top: 8px;
        right: 30px;
        font-size: 14px;
    }

    .el-icon-bell {
        position: absolute;
        top: 8px;
        right: 50px;
        font-size: 14px;
    }

    &:nth-of-type(2n) {
        margin: 0 0 15px 0;
    }

    &:hover {
        box-shadow: $shadow;

        .classTask_lk,
        .classTaskLook {
            visibility: visible;
            opacity: 1;
        }
    }

}

.classTask_l2 {
    margin: 10px 0 0px;
}

.classTask_l2_l {
    font-size: 14px;
    width: 110px;
    position: relative;
    width: 90px;
    height: 90px;

    .progressbar {
        width: 50px;
        height: 50px;
    }

    >p {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        color: #3cc080;
        font-size: 16px;
    }
}

.classTask_l2_r {
    >div {
        margin: 30px 0 55px 150px;

        &:nth-of-type(1) {
            margin-bottom: 20px;

            >span {
                font-size: 14px;
                color: #6A87AC;
                line-height: 19px;
                display: block;

                >i {
                    font-size: 12px;
                    color: #3A3A3A;
                    margin-left: 10px;
                }

                strong {
                    display: inline-block;
                    vertical-align: top;
                    max-width: 102px;
                    @extend .i_text;
                }
            }
        }

        &:nth-of-type(2) {
            font-size: 14px;
            color: #000000;
        }
    }
}

.classTask_l3 {
    >span {
        font-size: 14px;
        color: #3377AA;
        background: #E7F5FF;
        border: 1px solid #D8E9FF;
        border-radius: 3px;
        padding: 5px;
        margin-right: 10px;
    }

    >i {
        font-size: 14px;
    }

    .Tstate_n {
        color: #D88816;
    }

    .Tstate_y {
        color: $sc_6;
    }

    .Tstate_w {
        color: #888888;
    }
}

.classTask_lk,
.classTaskLook {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .5);
    text-align: center;
    @extend .i_transition;
    visibility: hidden;
    opacity: 0;
    // z-index: 2;

    a {
        display: inline-block;
        vertical-align: top;
        width: 100px;
        height: 36px;
        line-height: 36px;
        background: $bg_1;
        color: $sc_1;
        margin-top: 110px;
        border-radius: 30px
    }

    button {
        margin-top: 110px;
        border-radius: 30px
    }
}

.detailsTask_info_l {
    background: #E8F2FF;
    width: 420px;
    min-height: 304px;
    padding: 30px 20px;
}


.detailsTask_info_l1 {
    margin-bottom: 30px;

    >a,
    >span {
        display: inline-block;
        vertical-align: top;
        width: 80px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        color: $sc_1;
        background: $bg_1;
        margin-right: 10px;
        border-radius: 3px;
    }
}

.detailsTask_if {
    margin-bottom: 20px;

    >span {
        float: left;
        display: block;
        font-size: 14px;
        color: #666666;
        line-height: 19px;
    }

    >div {
        margin-left: 100px;
        word-wrap: break-word;
        word-break: break-all;

        >strong {
            font-size: 18px;
            height: 24px;
        }

        >span {
            font-size: 14px;
            color: #000000;
            line-height: 19px;
        }

        >div {
            >span {
                font-size: 14px;
                color: #000000;
                line-height: 19px;
            }

            >a {
                color: $sc_6;
                font-size: 14px;
                line-height: 19px;
                margin-left: 15px;
            }

            &:first-of-type {
                margin-bottom: 20px;
            }
        }
    }

    .path_route {
        color: $sc_6;
        line-height: 19px;
    }

    &:last-of-type {
        margin: 0;
    }
}


.detailsTask_info_r {
    width: 170px;

    >p {
        text-align: center;
        font-size: 14px;
        line-height: 19px;
        margin-bottom: 20px;

        >i {
            margin-left: 20px;
        }

        &:nth-of-type(2) {
            color: #3BB080;
        }

        &:nth-of-type(3) {
            color: #EBA300;
        }
    }
}

.detailsTask_info_r1 {
    height: 200px;
    text-align: center;
    margin-top: 30px;

    >.echarts {
        width: 100%;
        height: 100%;
    }

}

.detailsTask_table_h {
    margin: 30px 0 20px;

    >label {
        font-size: 14px;
        line-height: 19px;
        margin-right: 40px;
        text-align: center;
        cursor: pointer;

        >input {
            display: none;
        }

        >input:checked+span {
            color: $sc_6
        }
    }
}

.detailsTask_table_c {
    .el-table {
        th {
            background: #EFEFEF;
            color: #666666;
        }

        td {
            a {
                color: $sc_6;
            }

            .el-icon-circle-check {
                color: #3BB080
            }

            .el-icon-circle-close {
                color: red
            }
        }
    }
}

.releaseTask_form {
    .el-select {
        width: 220px;
    }

    .el-col-2 {
        text-align: center;
    }

    .el-form-item__content {
        position: relative;

        textarea {
            border-radius: 0;
        }

        .sumTXT {
            position: absolute;
            bottom: 5px;
            right: 10px;
            line-height: 19px;
            color: $sc_5;

            >i {
                color: $sc_2;
            }
        }
    }

    .el-form-item__label {
        text-align: left;
    }
}

.rangeIt {
    .el-input {
        width: 79%;
    }

    .el-button {
        width: 80px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        padding: 0;
        color: #fff;
        border: 0;
    }

    .tag_x {
        margin-left: 15px;
        color: $sc_6;
        line-height: 30px;
    }
}

.correlationTk {
    position: relative;

    .el-button,
    .uploader-btn {
        width: 80px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        padding: 0;
        color: #6A7FBC;
        border: 0;
        background: #ecf5ff;
        margin: 0 10px 0 0;

    }

    .uploadTK {
        display: inline-block;
        vertical-align: top;
    }

    .uploader-btn {
        position: absolute;
        top: -40px;
        left: 100px;
        border-radius: 4px;

        &:hover {
            background: $bg_1;
            color: $sc_1;
        }
    }
}

.submitFormTk {
    margin-top: 60px;

    .el-button {
        padding: 0;
        width: 80px;
        height: 30px;
        line-height: 30px;
        text-align: center;
        border: 0;

        &:nth-of-type(1) {
            color: #6A7FBC;
            background: #ecf5ff;
        }
    }

}


.releaseTK {
    padding: 25px 40px 40px;

    .el-transfer-panel {
        width: 250px;
        height: 380px;

        &:nth-of-type(2) {
            width: 500px;
        }
    }

    .el-transfer-panel__body {
        height: 337px;

        .el-transfer-panel__list {
            height: 98%;
        }
    }

    .has-gutter th {
        text-align: center;
    }

    .el-table__body-wrapper {
        height: 400px;
        overflow-y: auto;

        .task-radio {
            text-align: center;

            .el-radio__label {
                font-size: 0;
            }

        }
    }
}

.releaseTK_h {
    margin-bottom: 20px;

    >span {
        font-size: 14px;
        color: #666666;
        line-height: 19px;

        &:nth-of-type(2) {
            margin-left: 320px;
        }
    }
}

.releaseTK_btn {
    text-align: center;
    padding: 0 0 20px 0;
}

.resourceType {
    width: 160px;
    position: relative;
    margin-right: 15px;
}

.resourceSearch {
    width: 320px;
}


.pageTable {
    border: $bd_1;

    .el-pagination {
        padding: 5px 10px;
    }
}

.detailsTask_lv {
    a {
        color: $sc_6;
    }

    button {
        padding: 0;
        border: 0;
        background: none;
    }
}

.classResources {
    .u_resourceH_r {
        width: 200px;
    }

    .el-select {
        width: 160px;
    }

    .resourceLs {
        padding: 20px 0;
    }

    .resource_txt {
        margin-left: 70px;
    }
}

.sendNotice_form {
    .el-form-item__label {
        text-align: left;
    }

    .el-form-item__content {
        position: relative;
    }

    .sunWords {
        position: absolute;
        bottom: 5px;
        right: 15px;
        line-height: 19px;
        color: $sc_5;

        >i {
            color: $sc_2
        }
    }

    .el-select {
        width: 100%;
    }
}

.el-textarea__inner {
    border-radius: 0
}

.classMembers_th {
    background: #E7F5FF;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    margin: 20px 0 0;
    position: relative;

    >span {
        font-size: 14px;
        color: #3377AA;
        margin-right: 40px;

        &:first-of-type {
            display: inline-block;
            vertical-align: top;
            max-width: 210px;
            @extend .i_text;
        }
    }

    .classCode {
        position: absolute;
        top: 1px;
        right: 10px;
        line-height: 19px;

        p {
            color: #3377AA;

            &:nth-of-type(2) {
                color: #999;
            }

            i {
                font-size: 14px;
            }
        }
    }
}

.el-table--enable-row-transition {
    .el-table__body {
        td {
            a {
                color: $sc_6;
                font-size: 14px;
            }
        }
    }
}


.membersOP {
    >a {
        display: inline-block;
        vertical-align: top;
        background: $bg_1;
        border-radius: 3px;
        width: 80px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        color: $sc_1;
    }
}



.Invite_us {
    margin-top: 40px;

    >span {
        display: inline-block;
        vertical-align: top;
        line-height: 40px;

        &:nth-of-type(1) {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            overflow: hidden;

            >img {
                width: 100%;
                height: 100%;
            }
        }

        &:nth-of-type(2) {
            margin: 0 40px 0 20px;
        }

        &:nth-of-type(2),
        &:nth-of-type(3) {
            font-size: 12px;
            color: #888;

            >i {
                font-size: 20px;
                color: #8ab2c5;
                margin-left: 10px;
            }
        }
    }
}

.el-input-group__append {
    background: $bg_1;
    color: $sc_1;
    border: 1px solid #338efc;
}


.Invite_sl {
    margin: 20px 0 40px;
}

.Invite_ {
    border: 1px solid #EFEFEF;
    height: 420px;
    margin-top: 20px;
}

.Invite_l {
    width: 210px;
    height: 100%;
    border-right: 1px solid #EFEFEF;
    ;

    .el-scrollbar__wrap {
        overflow-x: hidden;
    }

    .el-collapse-item__header {
        height: 40px;
        line-height: 40px;
        padding: 0 10px;
        border-bottom: $bd_1;
    }

    .el-collapse-item__arrow {
        line-height: 40px;
    }

    .el-collapse {
        border: 0
    }

    .el-collapse-item__content {
        padding-bottom: 0;
    }
}


.selectName {
    line-height: 36px;
    padding: 0 10px;
    cursor: pointer;
    text-align: center;
    text-align-last: justify;

    >span,
    >em,
    >i {
        display: inline-block;
        vertical-align: top;
        text-align: left;
        text-align-last: initial;
    }

    >i {
        font-size: 18px;
        color: $sc_6;
        margin-top: 8px;
    }

    >span {
        width: 158px;
        height: 36px;
        @extend .i_text;
    }

    &:hover {
        background: $bg_5;
    }
}

.available {
    text-align: center;
    font-size: 12px;
    color: $sc_5;
    line-height: 40px;
}

.Invite_r {
    width: 426px;
    height: 100%;
}

.Invite_rh {
    background: #F8F8F8;
    border-bottom: 1px solid #EFEFEF;

    >span {
        display: block;
        @extend .i_text;
        line-height: 36px;
        font-size: 12px;
        color: #666666;
        float: left;
        text-align: center;

        &:nth-of-type(1) {
            width: 140px;
        }

        &:nth-of-type(2) {
            width: 140px;
        }

        &:nth-of-type(3) {
            width: 83px;
        }

        &:nth-of-type(4) {
            width: 49px;
            cursor: pointer;
            text-align: right;
        }
    }
}

.Invite_rls {
    @extend .Invite_rh;
    background: none;

    >span {
        color: $sc_3;
    }

    .el-icon-remove {
        font-size: 18px;
        color: $sc_6;
    }

    &:hover {
        background: $bg_5;
    }
}

.Invite_rc {
    height: 384px;
    overflow: hidden;
}


.Invite_prompt {
    font-size: 12px;
    color: #888888;
    margin: 20px 0 45px;
}


.setupPost_xx {
    text-align: center;
    text-align-last: justify;
    padding-top: 30px;

    >li {
        text-align: left;
        text-align-last: initial;
    }
}


.setupPost_h {
    margin-top: 40px;
    border-bottom: $bd_1;
    padding-bottom: 15px;

    font-size: 12px;
    line-height: 19px;
    color: #8ab2c5;
}



.setupPost_ls {
    width: 200px;
    margin: 0 20px 20px 0;

    >span {
        float: left;
        display: block;
        line-height: 40px;
        max-width: 75px;
        overflow: hidden;
        @extend .i_text;
        height: 40px;
    }

    >div {
        width: 120px;
        margin-left: 80px;
    }

    &:nth-of-type(3n) {
        margin: 0 0 20px 0;
    }
}

.signOut {
    padding: 20px;
    position: relative;

    .el-form-item__label {
        @extend .i_text;
    }
}

.numberWord {
    position: absolute;
    bottom: 5px;
    right: 15px;
    color: $sc_5;
    line-height: 19px;

    >i {
        color: $sc_2;
    }
}



.InvitationVal {
    height: 200px;
    margin-bottom: 20px;
}

.i_gp {
    padding: 20px;
}

.classSchedule_batle,.tabel_class  {
    >table {
        width: 100%;
        line-height: 40px;
        text-align: center;
        font-size: 14px;
        border: $bd_1;

        thead {
            border-bottom: $bd_1;

            th {
                width: 110px;
                border-right: $bd_1;
                text-align: center;
            }
        }

        tbody {
            td {
                border: $bd_1;

                >div {
                    @extend .i_word;
                }
            }
        }
    }

    .el-icon-plus {
        background: #e8f2ff;
        color: $sc_6;
        padding: 5px;
        border-radius: 50%;
        overflow: hidden;
        vertical-align: middle;
        cursor: pointer;
    }

    .timeSchedule {
        font-size: 12px;
    }
}

.classSchedule_hv {
    width: 110px;
    height: 38px;
    position: relative;
    overflow: hidden;

    >div {
        width: 0;
        height: 0;
        border-width: 0px 112px 38px 0px;
        border-style: solid;
        border-color: #444 white;
    }

    >p {
        width: 0;
        height: 0;
        border-width: 0px 117px 40px 0px;
        border-style: solid;
        border-color: black transparent white white;
        position: absolute;
        top: 0;
        left: 0;
    }

    >span {
        line-height: 19px;
    }

    >.s1 {
        position: absolute;
        bottom: 15px;
        left: 20px;
        bottom: 3px;
        left: 8px;
    }

    >.s2 {
        position: absolute;
        right: 14px;
        top: 4px;
    }
}

.classSchedule_btn {
    text-align: center;
    margin-top: 40px;

    button {
        padding: 0;
        width: 80px;
        height: 30px;
        line-height: 30px;
        text-align: center;
    }
}

.teaching_link {
    width: 200px;
    background: $bg_3;
    padding: 20px 0;

    >a {
        display: block;
        height: 60px;
        line-height: 60px;
    }
}

#teaching {
    padding: 30px 0 120px;
}

.teaching_cont {
    width: 700px;
    padding: 25px 40px 60px;
    background: $bg_3;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    border-radius: 3px;
    min-height: 555px;

    &:after,
    &:before {
        box-sizing: initial;
    }
}

.teaching_cont2 {
    padding: 25px 0 60px;
    width: 780px;
}

.teach_lk {
    >a {
        width: 80px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        color: $sc_1;
        background: $bg_1;
        border-radius: 3px;
        display: block;
    }
}

.teach_h {
    margin-bottom: 20px;

    >span {
        font-size: 14px;
        line-height: 19px;
    }

    >a {
        font-size: 14px;
        line-height: 19px;

        >i {
            color: $sc_2;
            padding: 0 10px;
        }

        &:last-of-type {
            color: $sc_5;
        }
    }
}


.teachVideo_ls {
    padding: 10px;
    // padding: 30px 20px;
    // border-bottom: $bd_3;
    border: $bd_3;
    margin-bottom: 30px;


    >a,
    >.teachVideo_lsl {
        width: 160px;
        height: 90px;
        overflow: hidden;
        border: $bd_3;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    &:first-of-type {
        // border-top: $bd_3;
    }

    &:hover {
        .teachVideo_lsr1>a {
            color: $sc_6;
        }

        .teachVideo_lsr1>.live_url {
            color: $sc_6;
        }
    }

    .classTeest_rTx {
        background: #F7F7F7;
        padding: 20px;
        margin-top: 20px;
        border-radius: 6px;
    }
}

.teachVideo_lsr {
    margin-left: 180px;
}

.teachVideo_lsr1 {
    height: 26px;

    >a,
    .live_url {
        float: left;
        display: block;
        font-size: 16px;
        font-weight: bold;
        line-height: 21px;
        @extend .i_text;
        max-width: 60%;
        cursor: pointer;
    }

    .live-state,
    .live-state1 {
        display: inline-block;
        vertical-align: top;
        font-size: 14px;
        color: #FFFFFF;
        line-height: 19px;
        float: left;
        padding: 3px 8px;
        margin-right: 12px;
    }

    .live-state {
        background-color: #67C23A;
    }

    .live-state1 {
        background-color: #CACACA;
    }
}

.teachVideo_lsr1_r {
    >a {
        display: inline-block;
        vertical-align: top;
        width: 60px;
        height: 24px;
        border: $bd_4;
        color: $sc_6;
        border-radius: 3px;
        text-align: center;
        line-height: 24px;
        margin-right: 20px;
    }

    .el-icon-arrow-down {
        font-size: 16px;
        color: #888;

        &:before {
            content: "\e794"
        }
    }
}

.teachVideo_lsr2 {
    overflow: hidden;
    margin-top: 20px;

    >span {
        font-size: 14px;
        color: #666666;
        margin-right: 15px;

        &:after {
            content: '';
            border-right: $bd_3;
            padding-left: 15px;
            height: 12px;
        }

        &:last-of-type {
            &:after {
                display: none;
            }
        }
    }

    >i {
        float: right;
    }

    .Tstate_n {
        color: #EBA300;
    }

    .Tstate_y {
        color: #3BB080;
    }

    >p {
        @extend .i_text;
    }
}

.teachVideo_lsr2 {
    font-size: 14px;
    color: #888888;
    line-height: 19px;
    margin-top: 20px;
    @extend .i_text;
}

.teachVideo_ch {
    margin: 30px 0;

    >label {
        line-height: 16px;
        margin-right: 40px;
        cursor: pointer;

        >input {
            display: none;
        }

        >input:checked+span {
            color: $sc_6;
        }
    }
}

.teachVideo_lsr4 {
    margin-top: 20px;

    >span,
    >a {
        line-height: 19px;
        color: $sc_6;
        font-size: 14px;
    }
}

.teachVideo_lsr5 {
    line-height: 30px;
    margin-top: 10px;

    button {
        width: 80px;
        height: 30px;

        text-align: center;
        padding: 0;
    }

    >span {
        font-size: 12px;
        color: #888888;
    }
}


.answerViews {
    .answerCont {
        padding: 30px 40px 40px;
    }

}

.answerCont_h {
    margin-bottom: 20px;

    >a {
        display: inline-block;
        vertical-align: top;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        overflow: hidden;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    >span {
        line-height: 40px;
        margin-left: 20px;
        color: $sc_4;
        font-size: 14px;
    }
}

.answerCont_TxT {
    padding-bottom: 20px;
    border-bottom: $bd_3;
    margin-bottom: 30px;
    max-height: 300px;
    overflow: hidden;
    overflow-y: auto;

    >.answerCont_TxT_h {
        font-size: 16px;
        font-weight: bold;
        line-height: 21px;
        @extend .i_word;
        margin-bottom: 20px;
        color: $sc_2;
    }

    .answerCont_time {
        font-size: 12px;
        color: #888888;
        margin-top: 20px;
    }
}


.publishFrom_seleck {
    display: flex;
    justify-content: space-between;

    >.el-form-item {
        display: inline-block;
        vertical-align: top;
    }

    .lectureTeacher {
        width: 217px;

        >input {
            &:disabled {
                color: #000;
                background: none;
            }
        }

    }
}

.pause {
    font-size: 14px;
    color: #888888;
    line-height: 19px;
}

.pauseVal {
    margin-left: 20px;

    .el-input {
        >input {
            padding: 0;
            text-align: center;
        }
    }

    .el-input-number {
        width: 120px;
    }

    .el-input-number__decrease,
    .el-input-number__increase {
        width: 30px;
    }
}

.publishFrom_up {
    text-align: center;
    text-align-last: justify;

    >div {
        text-align-last: initial;
        text-align: left;
        display: inline-block;
        vertical-align: top;
    }
}


.publishFrom_ {
    width: 240px;
    height: 135px;
    border: $bd_1;
    position: relative;
    overflow: hidden;

    >img {
        width: 100%;
        height: 100%;
    }

    .avatar-uploader {
        height: 100%;
    }

    .el-upload--text {
        width: 100%;
        height: 100%;
    }
}

.publishFrom_b {
    text-align: center;

    >i {
        margin: 20px 0;
    }

    >p {
        font-size: 12px;
        color: $sc_4;
        line-height: 19px;
    }
}

.publishFrom {
    margin-top: 30px;

    .el-table {
        th {
            background: #EFEFEF;
        }
    }

    .el-input__inner,
    .el-textarea__inner,
    .is-disabled+span.el-checkbox__label {
        color: $sc_2 !important;
    }

    .el-checkbox+.el-checkbox {
        margin: 0;

    }

    .el-checkbox-group>label {
        margin-right: 20px !important;
    }

}





.publishMenu {
    .el-menu-item {
        padding: 0 18px;
    }

    video {
        object-fit: contain;

    }
}

.information {
    background: #EFF6FF;
    padding: 25px 45px 20px;
    margin-bottom: 40px;
}

.information_l {
    >span {
        text-align: center;
        display: inline-block;
        vertical-align: top;
        margin-right: 60px;

        >p {
            color: #888;
            line-height: 16px;
            margin-top: 10px;
        }

        &:last-of-type {
            margin-right: 0;
        }
    }
}

.information_r {
    >p {
        font-size: 12px;
        color: #666666;
        text-align: right;

        >strong {
            font-size: 36px;
            color: #E1733A;
            line-height: 46px;
        }

        &:first-of-type {
            margin-bottom: 30px;
        }
    }
}

.pointMark_video {
    width: 700px;
    height: 400px;
    overflow: hidden;
    margin-top: 30px;

    >img {
        width: 100%;
        height: 100%;
    }

    .video-player {
        width: 100%;
        height: 100%;
    }
}

.publishFrom_if_l {
    >span {
        color: #606266;
        margin-left: 25px;
        position: relative;

        .el-date-editor {
            margin-left: 15px;
        }
    }

    .second {
        position: absolute;
        right: 55px;
        top: 0;
        color: #333
    }

    .el-icon-location {
        font-size: 20px;
        color: $sc_6;
        padding: 10px;
        background: #E8F2FF;
        border-radius: 3px;
        vertical-align: top;
        cursor: pointer;
    }

    .el-date-editor {
        width: 180px;
    }
}

.publishFrom_if_r {


    button {
        width: 100px;
        height: 36px;
        line-height: 36px;
        margin-left: 15px;
    }
}

.publishFrom_table {
    margin-top: 10px;
}

.publishFrom_btn {
    text-align: right;

    button {
        margin-left: 30px;
        width: 100px;
        height: 36px;
        line-height: 36px;
    }
}


.vjs-custom-skin>.video-js .vjs-big-play-button {

    border-radius: 50%;
    height: 3em !important;
    line-height: 3em !important;
}

.publishFrom_if2 {
    margin: 40px 0;
}

.publishFrom_ad {
    text-align: right;
    margin-bottom: 30px;
}

.el-form {
    width: 100%;
}

.addAttachments-c {
    padding: 30px 30px 60px;

    .urlTxt {
        font-size: 12px;
        color: #888;
        margin-left: 20px;
        max-width: 300px;
        @extend .i_text;
    }
}

.uploader-file-actions {
    .uploader-file-pause {
        display: none !important;
    }
}


.videoIntegration_tm {
    .el-form-item {
        float: left;

        .el-input {
            width: 120px;
        }

        .el-form-item__label {
            font-size: 12px;
        }

        .el-icon-location {
            font-size: 20px;
            color: #348efc;
            padding: 10px;
            background: #E8F2FF;
            border-radius: 3px;
            vertical-align: middle;
            cursor: pointer;
        }
    }

    .t_length {
        font-size: 20px;
        color: #348EFC;
    }
}

.videoIntegration_table {
    margin-bottom: 30px;

    .el-form {
        background: #F1F6FB;
        padding: 20px 0;
    }

    .buttonCSS {
        margin-bottom: 0;
    }
}

.tipcd {
    font-size: 12px;
    color: #666666;
    line-height: 19px;
    margin-bottom: 10px;
}

.fragment_ls {
    width: 160px;
    height: 90px;
    border: $bd_1;
    position: relative;
    margin: 0 0 10px 10px;

    >img {
        width: 100%;
        height: 100%;
    }

    >div {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .12);
        text-align: center;
        @extend .i_transition;
        visibility: hidden;
        opacity: 0;

        >i {
            margin-top: 30px;
            font-size: 28px;
            color: #fff;
            cursor: pointer;
        }
    }

    &:hover {
        >div {
            visibility: visible;
            opacity: 1;
        }
    }
}

.fragmentUp {
    text-align: center;
    width: 160px;
    height: 90px;
    border: $bd_1;
    margin-left: 10px;
    background: rgba(0, 0, 0, .02);
    cursor: pointer;

    >p {
        line-height: 20px;
        margin-top: 5px;
        color: #888;
    }

    >i {
        margin-top: 20px;
        font-size: 30px;
        color: $sc_6;
    }
}

.fragment_cont {
    // height: 92px;
    padding: 10px 0;
    overflow: hidden;
    background: #F1F6FB;
    overflow-y: auto;

}

.fragment {
    margin: 30px 0 20px;
}

.editorQuestion-c {
    padding: 20px 30px 40px;

    .el-tabs--card>.el-tabs__header .el-tabs__nav,
    .el-tabs--card>.el-tabs__header .el-tabs__item {
        border: 0;
    }

    .el-tabs__item {
        padding: 0 10px;
    }
}

.editorQuestion_tab {
    max-height: 660px;
    min-height: 500px;
    margin-bottom: 20px;
}


.editorQuestion_ls {
    margin-bottom: 20px;

    >span {
        float: left;
        display: block;
        width: 60px;
        font-size: 14px;
        line-height: 36px;
    }

    .el-checkbox-group,
    .el-radio-group {
        line-height: 36px;
    }
}

.editorQuestion_lsr {
    margin-left: 60px;

    >input[type="text"] {
        height: 36px;
        line-height: 36px;
    }
}

.videoIntegration_xz {
    display: flex;
    justify-content: space-between;
    padding: 60px 50px 50px;

    >div {
        text-align: center;
        width: 205px;
        height: 180px;
        background: #F0F4FD;
        cursor: pointer;
        position: relative;

        >i {
            margin: 40px 0;
        }

        >p {
            font-size: 14px;
            font-weight: bold;
        }
    }
}



.liveReservation_date {
    margin-right: 15px;

    .el-input__prefix {
        left: initial;
        right: 0;
        background: $bg_1;
        color: $sc_1;
        width: 44px;
        font-size: 18px;
    }

    .el-input__inner {
        padding-left: 12px;
    }

    .el-input__suffix {
        right: 48px;
    }
}

.liveReservation_select {
    width: 200px;
    margin-right: 15px;

    .el-input__suffix {
        right: 10px;
    }
}



.noticeTxT {
    background: #FFFCE6;
    padding: 15px 25px 25px;
    margin-top: 30px;
    color: #B59F45;

    >h3 {
        font-size: 14px;
        margin-bottom: 20px;
    }

    >p {
        line-height: 19px;

        i {
            font-family: "Simsun";
            padding: 0 5px;
        }
    }
}

.liveReservation_h,
.studentLeave_h {
    margin-bottom: 30px;

    >a {
        font-size: 14px;
        line-height: 19px;
        margin-right: 40px;
    }

    .showActive {
        color: $sc_6;
    }
}


.myLive_ch {
    >label {
        margin-right: 30px;
        line-height: 36px;
        font-size: 12px;
        color: $sc_4;
        cursor: pointer;

        >input {
            display: none;
        }

        >input:checked+span {
            color: $sc_6;
        }
    }
}

.myLive_ls {
    .teachVideo_lsr1 {
        >span {
            font-size: 14px;
            color: #FFFFFF;
            display: block;
            width: 60px;
            height: 26px;
            line-height: 26px;
            text-align: center;
            background: #D0D0D0;
            margin-right: 15px;
        }

        .Lstate_w {
            background: #EBA300;
        }

        .Lstate_j {
            background: #3BB080;
        }

        .Lstate_o {
            background: #D0D0D0;
        }

        .Lstate_s {
            background: #348EFC;
        }

        .Lstate_x {
            background: #C82566;
            cursor: pointer;
        }
    }

    .teachVideo_lsr2 {
        >span {
            &:last-of-type {
                &:after {
                    display: none;
                }
            }
        }
    }

}

.refusalTxT {
    padding: 70px 40px;
    text-align: center;
    font-size: 14px;
}

.make_link {
    width: 80px;
    height: 36px;
    line-height: 36px;
    background: $bg_1;
    text-align: center;
    color: $sc_1;
    border-radius: 3px;
}

.make_time {
    display: flex;
    justify-content: space-between;

    >div {
        display: inline-block;
        vertical-align: top;
        text-align: left;
        text-align-last: initial;

        &:nth-of-type(1) {
            width: 220px;
        }

        &:nth-of-type(2) {
            width: 200px;

            .el-input__prefix {
                left: initial;
                right: 0;
                background: $bg_1;
                color: $sc_1;
                width: 44px;
                font-size: 20px;
                height: 40px;
                border-radius: 0 3px 3px 0;
            }

            .el-input__suffix {
                right: 48px;
            }

            .el-input__inner {
                padding-left: 12px;
            }
        }
    }

    .Livesection {
        width: 260px;

        .el-col-11 {
            width: 118px;
        }

        .el-col-2 {
            text-align: center;
        }

        .el-date-editor.el-input {
            width: 100% !important;
        }
    }

}

.live-timer {
    justify-content: start;

    >div:nth-of-type(1) {
        width: 100px;
    }

    .Livesection {
        margin-left: 20px;
    }
}


.dateTime {
    .el-input__icon {
        color: $sc_1;
        font-size: 18px;
    }

    .el-input__suffix {
        right: 48px;

        >i {
            width: 22px;
            color: $sc_5;
        }
    }

    .el-date-editor {
        margin-right: 20px;
    }
}


.liveSelect {
    >div {
        width: 110px;
        margin-right: 5px;
    }
}


.teachAlbum_lsr2 {
    margin-top: 15px;

    >strong {
        font-size: 14px;
        color: #348EFC;
        margin-right: 15px;
    }

    >span {
        line-height: 16px;
        color: $sc_4;
        padding: 4px 7px;
        background: #E9E9E9;
        margin-right: 10px;

        &:first-of-type {
            position: relative;
            margin-left: 15px;

            &:after {
                content: '';
                display: inline-block;
                border-right: $bd_1;
                height: 10px;
                position: absolute;
                top: 7px;
                left: -15px;
            }
        }
    }
}

.addAlbum_ls {
    margin-bottom: 20px;

    >span {
        display: inline-block;
        width: 100px;
        line-height: 40px;
        float: left;
    }

    .el-tabs__header .el-tabs__item {
        border: none;
        background: #ecf5ff;
        border-radius: 4px;
        margin-right: 2px;
    }

    .el-tabs__item.is-active {
        background: #409EFF;
        color: #fff;
    }

    .el-tabs__new-tab {
        color: #338efc;
        border-color: #338efc;
    }

    .el-tabs--card>.el-tabs__header,
    .el-tabs--card>.el-tabs__header .el-tabs__nav {
        border: 0;
    }

    .el-icon-arrow-left,
    .el-icon-arrow-right {
        color: #338efc
    }
}


.addAlbum_x {
    background: #F2F2F2;
    padding: 30px 20px;

    .addAlbum_x1 {
        margin-bottom: 20px;
    }


    .addAlbum_x2 {
        margin-bottom: 20px;
    }

    .addAlbum_x3 {
        margin-bottom: 20px;
    }
}



.addAlbum_xp {
    padding: 20px 0;
    border-bottom: $bd_1;

    >p {
        float: left;
        line-height: 19px;
        max-width: 60%;
        @extend .i_text;
        font-size: 14px;
    }

    >div {
        font-size: 16px;
        color: $sc_4;
        line-height: 19px;

        >i {
            cursor: pointer;
        }
    }

    &:first-of-type {
        border-top: $bd_1;
    }
}


.interlocution_ch {
    margin-bottom: 30px;

    >label {
        font-size: 12px;
    }
}


.quiz {
    >span {
        display: inline-block;
        vertical-align: text-bottom;
        font-size: 14px;
        line-height: 19px;

        &:last-of-type {
            max-width: 300px;
            @extend .i_text;
        }
    }
}

.interlocution_lsr1 {
    margin-top: 10px;

    >strong {
        font-size: 14px;
        color: #348EFC;
        line-height: 19px;
    }
}

.interlocution {
    .teachVideo .teach_h {
        display: none;
    }

}

.interlocution_lsr2 {
    margin-top: 10px;
    line-height: 30px;

    button {
        width: 80px;
        height: 30px;

        text-align: center;
        padding: 0;
        border-radius: 3px;
    }
}

.myTask_class {
    width: 140px;
}


.resourceAudit {
    .cell {
        button {
            font-size: 14px;
        }
    }

    .el-table__fixed-right {
        background: $bg_3;
    }

    .el-icon-circle-check {
        color: #3BB080;
        font-size: 16px;
    }

    .el-icon-time {
        color: #D88816;
        font-size: 16px;
    }

    .el-icon-circle-close {
        color: red;
        font-size: 16px;
    }
}

.credit_class {
    width: 140px;
    margin-right: 20px;
}

.myCourse_lsr2 {
    margin-top: 10px;

    >span {
        color: $sc_4;
        line-height: 19px;
    }
}

.myCourse_lsr3 {
    margin-top: 15px;

    >a {
        margin-right: 15px;
        font-size: 12px;
        line-height: 20px;

        &:last-of-type {
            margin-right: 0;
        }
    }
}

.AddCourses_c {
    padding: 35px 30px 40px;
}

.curriculum {
    margin-top: 30px;
}


.courseCourseware_add {
    margin: 30px 0 25px;

    button {
        border: 0;

        i {
            margin-right: 20px;
        }
    }

    >span {
        line-height: 36px;
        color: $sc_4;
    }
}

.uploadingData_ls {
    margin-bottom: 25px;

    >span {
        display: block;
        float: left;
        width: 100px;
        line-height: 36px;
    }

    >div {
        margin-left: 100px;
    }
}

.uploadingData_lsr {
    >span {
        display: inline-block;
        vertical-align: top;
        width: 100px;
        height: 36px;
        line-height: 36px;
        background: #348EFC;
        border-radius: 3px;
        text-align: center;
        color: $sc_1;
    }

    >strong {
        line-height: 36px;
        display: inline-block;
        max-width: 300px;
        overflow: hidden;
        color: $sc_4
    }

    input {
        width: 100%;
    }
}



.uploadingData_c {
    padding: 40px 30px 60px;

    .buttonCSS {
        margin-top: 50px;
    }
}

.teachingPlan_x1 {
    margin-top: 10px;

    >span,
    >strong {
        font-size: 14px;
        color: $sc_4;
        line-height: 19px;
    }

    >strong {
        color: $sc_6;
        margin-left: 20px;
    }
}

.teachingPlan_x2 {
    margin-top: 20px;

    >span {
        font-size: 12px;
        color: #888888;
        line-height: 16px;
    }
}

.teachingPlan_icon {
    margin-top: 15px;
}

.teachingPlan_add {
    width: 130px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    font-size: 14px;
    color: #348EFC;
    background: #DEEFFF;
    border-radius: 3px;
    display: inline-block;
    vertical-align: top;

    >i {
        margin-right: 10px;
    }
}

.design_teaching_plan_t {
    font-size: 18px;
    color: #000000;
    font-weight: bold;
    line-height: 24px;
    border-top: $bd_1;
    border-bottom: $bd_1;
    padding: 30px 0;
    margin-bottom: 20px;
}

.design_teaching_plan_c {

    .el-tabs--card>.el-tabs__header,
    .el-tabs--card>.el-tabs__header .el-tabs__nav {
        border: 0;
    }

    .el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable {
        background: $bg_1;
        color: $sc_1;
    }

    .el-tabs__item {
        background: #EFEFEF;
        margin-right: 5px;
    }
}

.design_teaching_plan_c1 {

    >p {
        line-height: 19px;
        margin-bottom: 10px;
    }
}

.design_teaching_plan_cb {
    background: #E8F2FF;
    padding: 30px 40px;
    margin-bottom: 30px;
}

.teachingGoal {
    margin-bottom: 20px;

    >p {
        line-height: 19px;
        margin-bottom: 10px;
    }

    &:last-of-type {
        margin-bottom: 0;
    }
}

.teachingPx {
    margin-bottom: 30px;

    >p {
        line-height: 19px;
        margin-bottom: 10px;
    }

    .ql-toolbar {
        background: #EFEFEF;
    }
}

.teachingPD {
    margin-bottom: 30px;

    >span {
        display: block;
        float: left;
        width: 100px;
        line-height: 36px;
    }

    >div {
        margin-left: 100px;

        >span,
        strong {
            display: inline-block;
            vertical-align: top;
            line-height: 36px;
            color: #888;
        }

        >span {
            width: 80px;
            height: 36px;
            text-align: center;
            background: #E8F2FF;
            border-radius: 3px;
            font-size: 14px;
            color: #6A7FBC;
            margin-right: 20px;
            cursor: pointer;
        }
    }

    .el-radio-group {
        line-height: 36px;
    }
}

.teachingBtn {
    margin-top: 20px;

    button {
        border: 0;
    }
}



.invitedClass_ls1 {
    margin-bottom: 20px;

    >a {
        display: block;
        font-size: 14px;
        line-height: 24px;
        max-width: 60%;
        @extend .i_text;
        font-weight: bold;
    }
}

.invitedClass_ls2 {
    margin-bottom: 20px;

    >span {
        font-size: 12px;
        color: $sc_4;
        line-height: 28px;
    }

    >i {
        margin-right: 50px;
    }
}

.invitedClass_ls3 {
    font-size: 14px;
    line-height: 24px;
    @extend .i_word;
}

.invitedClass_ls4 {
    margin-top: 40px;

    >span {
        display: inline-block;
        vertical-align: top;
        background: $bg_1;
        border-radius: 100px;
        color: $sc_1;
        padding: 8px 16px;
        margin-right: 15px;
    }
}

.invitedClass_ls5 {
    margin-top: 30px;

    >span {
        font-size: 12px;
        color: #888888;
        margin-right: 40px;

        &:last-of-type {
            margin-right: 0;
        }
    }

    >div {
        font-size: 14px;

        >strong {
            font-size: 30px;
            margin-left: 10px;
            color: #f0ad00;
        }
    }
}

.invitedClass_ls {
    border-bottom: $bd_1;
    padding: 30px 0;

    &:first-of-type {
        border-top: $bd_1;
    }
}

.leave_ls {
    border: $bd_1;
    width: 265px;
    height: 190px;
    padding: 30px 20px;
    position: relative;
    @extend .i_transition;
    margin: 0 20px 20px 0;

    .leave_ls1 {
        display: block;
        font-size: 16px;
        font-weight: bold;
        max-width: 70%;
        @extend .i_text;
        line-height: 21px;
        margin-bottom: 30px;
    }

    .leave_ls2 {
        font-size: 14px;
        color: #6A87AC;
        line-height: 19px;
        margin-bottom: 30px;
    }

    .leave_ls3 {
        margin-bottom: 30px;

        >p {
            font-size: 12px;
            color: #666666;
            line-height: 19px;
        }
    }

    .leave_ls4 {
        >span {
            font-size: 12px;
            color: #666666;
            line-height: 30px;
        }

        button {
            float: right;
            width: 75px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            padding: 0;
            border: 0;
            color: #7C9BB8;
        }
    }

    .leave_ls5 {
        position: absolute;
        top: 30px;
        right: 25px;

        >p {
            margin-top: 10px;
        }
    }

    .leave_ls6 {
        position: absolute;
        top: 30px;
        right: 25px;
        background: $bg_3;

        button {
            display: block;
            margin: 0 0 10px 0;
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            padding: 0;
            border: 0;

        }
    }

    &:nth-of-type(2n) {
        margin: 0 0 20px 0;
    }

    &:hover {
        box-shadow: $shadow;

        .leave_ls1 {
            color: $sc_6
        }
    }
}

.approved {
    >p {
        color: #3BB080;
    }
}

.unapproved {
    >p {
        color: #1995DB;
    }
}

.refuse {
    >p {
        color: red;
    }
}

.rescinded {
    >p {
        color: $sc_4;
    }
}


.newLeave_from {

    .el-select,
    .el-date-editor {
        width: 240px;
    }

    .line {
        text-align: center;
    }

    .el-date-editor {
        .el-input__prefix {
            left: initial;
            right: 0;
            width: 40px;
            background: $bg_1;
            color: $sc_1;
            font-size: 18px;
        }

        .el-input__suffix {
            right: 48px;
        }

        .el-input__inner {
            padding-left: 12px;
        }
    }

    .upImg {
        width: 80px;
        height: 36px;
        text-align: center;
        background: #E8F2FF;
        border-radius: 3px;
        font-size: 14px;
        color: #6A7FBC;
    }

}

.Approval_TXT {
    padding: 50px 20px;
    text-align: center;
    font-size: 14px;
    @extend .i_word;
}

.taskObject {
    .el-select {
        width: 100%;
    }
}


.deadline {
    .el-input__prefix {
        left: initial;
        right: 0;
        background: $bg_1;
        width: 44px;
        color: $sc_1;
        font-size: 18px;
    }

    .el-input__suffix {
        right: 48px;
    }

    .el-input__inner {
        padding-left: 12px;
    }
}


.long {
    .el-input {
        width: 220px;
        font-size: 18px;
        color: #DCA323;
    }

    >span {
        line-height: 36px;
        margin-left: 5px;
    }
}

.detailsLeave_ {
    background: #F3F8FF;
    padding: 45px 30px 60px;
    position: relative;
    margin-bottom: 55px;
}


.detailsLeave_ls {
    margin-bottom: 20px;

    >span {
        display: block;
        float: left;
        width: 100px;
        line-height: 19px;
        font-size: 14px;
    }

    >div {
        margin-left: 100px;

        >span {
            line-height: 19px;
            font-size: 14px;
            @extend .i_word;
        }

        >strong {
            color: $sc_6;
            line-height: 19px;
            font-size: 14px;
            cursor: pointer;
        }
    }
}

.previewIMG_ {
    text-align: center;
    vertical-align: middle;
}

.previewIMG {
    background: none;

    .el-dialog__header {
        display: none;
    }
}

.detailsLeave_st {
    position: absolute;
    top: 0;
    right: 0;
    top: 45px;
    right: 40px;

    >p {
        margin-top: 20px;
    }
}

.leaveRefusal {
    background: #FFF1EA;
    margin-top: 40px;
    padding: 30px;
    font-size: 14px;
    line-height: 19px;
    overflow: hidden;

    >span {
        display: block;
        width: 80px;
        float: left;
    }

    >strong {
        color: #DD5D5D;
        margin-left: 90px;
        display: block;
        @extend .i_word;
    }
}


.homeworkTask_h {
    background: $bg_3;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    z-index: 3;
    box-shadow: $shadow2;
}

.homeworkTask_hc {
    padding: 19px 35px 13px;
}

.homeworkTask_hc1 {
    font-size: 14px;
    line-height: 40px;

    >strong {
        color: #888;

        >i {
            padding: 0 10px;
            font-family: "Simsun";
        }
    }

    >span {
        cursor: pointer;
    }
}

.homeworkTask_hc3 {
    >button {
        border: 0;
        padding: 0 11px;
        height: 36px;
        height: 36px;
        text-align: center;
        color: $sc_1;
        border-radius: 3px;
        background: $bg_1;

        &:nth-of-type(1) {
            background: none;
            color: $sc_6;
        }
    }
}

.homeworkTask_hc2 {
    margin-right: 30px;

    >span {
        font-size: 26px;
        color: #F0C953;
        margin-left: 10px;
        line-height: 40px;
    }

    >i {
        vertical-align: top;
    }
}

.homeworkTask_c {
    background: #ffffff;
    margin: -20px 0 0 -320px;
    padding-bottom: 40px;
    position: relative;
    width: 1000px;
    min-height: 600px;
}

.homeworkTask_c1 {
    border-bottom: 1px dashed #ddd;
    padding: 22px 40px;

    >span {
        font-size: 12px;
        color: #888;
        margin-right: 90px;

        >i {
            font-size: 20px;
            margin-left: 15px;
        }

        &:nth-of-type(1) {
            >i {
                color: red;
            }
        }
    }
}

.topic {
    border-bottom: 1px solid #ddd;

    .Answer_key {
        color: #6A87AC;
        line-height: 30px;
    }
}

.homeworkTask_c2 {
    >h3 {
        font-size: 18px;
        line-height: 24px;
        text-align: center;
        margin: 30px 0;
    }

    >p {
        text-align: center;
        line-height: 16px;
        color: #888;
        margin-bottom: 20px;
    }

    >div {
        text-align: center;
        text-align-last: justify;
        margin: 24px 0 40px;
        padding: 0 170px;
        margin-bottom: 40px;

        >span {
            text-align: left;
            text-align-last: initial;
            line-height: 16px;
            display: inline-block;
        }
    }
}

.i_choiceT2 {
    background: #FAFAFA;

    .i_choiceT_l {
        color: #888;

        >span {
            &:after {
                display: none;
            }
        }
    }
}

.homeworkTask {
    .i_testTxt {
        >strong {
            color: #F0C953;

        }
    }

    .el-radio-group {
        display: block;
    }

    .i_choiceLs {
        margin-bottom: 10px;

        label {
            float: left;
            line-height: 30px;
        }

        >span {
            display: block;
            margin-left: 60px;
        }

        .is-disabled {
            .el-radio__label {
                color: #606266;

            }

            .el-textarea__inner {
                background-color: none
            }
        }

        &:last-of-type {
            margin-bottom: 0;
        }
    }

    .quillWrapper {
        margin-top: 10px;
    }

    .i_choiceLs2 {
        padding: 0 40px;

        >span {
            display: block;
            float: left;
            line-height: 40px;
        }

        >div {
            margin-left: 40px;
        }

        .is-disabled {
            .el-textarea__inner {
                background: none;
                color: #6A87AC;
            }
        }
    }

    .i_choiceT_l>span {
        &:after {
            display: none;
        }
    }

    .i_answe {
        margin: 20px 0;

        >div {
            color: #6A87AC;
            font-size: 14px;
            line-height: 24px;
        }
    }

    .i_grade {
        width: 140px;

        >input {
            padding: 0;
            text-indent: 12px;
        }
    }

    .b {
        .el-checkbox__inner {
            border-color: #E46363 !important;
            background: #E46363 !important;

            &:after {
                border: 0;
                top: 3px;
                left: 5px;
                height: 9px;
                border-left: 1px solid #fff
            }

            &:before {
                position: absolute;
                content: "";
                display: block;
                top: 2px;
                left: 5px;
                height: 9px;
                border-left: 1px solid #fff;
                -webkit-transform: rotate(136deg) scaleY(1);
                transform: rotate(136deg) scaleY(1);
            }
        }
    }
}

.homeworkTask_c3 {
    .el-form-item {
        margin-bottom: 0;
    }

    .el-form-item__error {
        top: 90%;
        left: 50%;
    }

    .keyTO {
        .el-checkbox__inner {
            border-radius: 50%;
        }

        .d {
            .el-checkbox__inner {
                border-color: #96D378 !important;
                background: #96D378 !important;

                &:after {
                    border-color: #fff;
                }
            }
        }

        .b {
            .el-checkbox__inner {
                border-color: #E46363 !important;
                background: #E46363 !important;

                &:after {
                    border: 0;
                    top: 3px;
                    left: 5px;
                    height: 9px;
                    border-left: 1px solid #fff
                }

                &:before {
                    position: absolute;
                    content: "";
                    display: block;
                    top: 2px;
                    left: 5px;
                    height: 9px;
                    border-left: 1px solid #fff;
                    -webkit-transform: rotate(136deg) scaleY(1);
                    transform: rotate(136deg) scaleY(1);
                }
            }
        }

        .a {
            .el-checkbox__inner {
                border-color: #348efc !important;
                background: #348efc !important;

                &:after {
                    border-color: #fff;
                }
            }
        }

    }

}



.i_choiceTXT {
    margin-bottom: 20px;
    margin-top: 10px;

    >div {
        margin: 0 !important;
    }

    .el-form-item__content {
        >span {
            display: inline-block;
            vertical-align: top;
        }

        >div {
            display: inline-block;
            margin-left: 15px;
            vertical-align: top;
        }
    }

}




.submitJob {
    .el-dialog__body {
        padding: 30px 45px;
    }
}

.submitJob_h {
    margin-bottom: 40px;

    >span {
        display: block;
        float: left;
        color: #666666;
    }

    >div {
        margin-left: 80px;
        text-align: left;

        >span {
            color: #888888;
            margin-right: 30px;

            >i {
                display: inline-block;
                vertical-align: middle;
                width: 14px;
                height: 14px;
                background: #84CB64;
                border-radius: 50%;
                overflow: hidden;
            }

            &:nth-of-type(2) {
                >i {
                    background: #E59D57;
                }
            }
        }
    }
}

.submitJob_c {
    padding-bottom: 40px;

    >p {
        margin-bottom: 20px;
    }

    >div {
        .el-button+.el-button {
            margin: 0;
        }

        >button {
            width: 24px;
            height: 24px;
            text-align: center;
            line-height: 24px;
            border-radius: 0;
            border: 0;
            padding: 0;
            border-radius: 580%;
            overflow: hidden;
            background: #E59D57;
            margin: 0 10px 10px 0 !important;

            >span {
                color: $sc_1;
            }

            &:hover {
                background: #E59D57;
                color: $sc_1;
            }

            &:disabled {
                background: #84CB64;

                &:hover {
                    background: #84CB64;
                    color: $sc_1;
                }
            }

            &:focus {
                background: #E59D57;
            }
        }
    }
}

.submitJob_btn {
    border-top: 1px dashed #ddd;
    padding-top: 35px;
}

.downloadTest_c {
    padding: 40px 50px;

    .el-radio {
        line-height: 40px;
        width: 200px;
    }

    .el-radio+.el-radio {
        margin: 0;
    }

    .el-form-item__label {
        text-align: left;
    }

    .el-form-item {
        border-bottom: 1px dashed #ddd;
        padding-bottom: 15px;
    }

    .buttonCSS {
        border: 0;
    }
}

.i_choiceTc {
    @extend .i_word;

    >div {
        margin: 20px 0 0 !important;
        ;
    }

    .el-form-item__label {
        text-align: left;
    }

    .el-form-item__content {
        color: #6A87AC;
    }

}

.diagram {
    padding-top: 50px;
}

.dependent {
    background: $bg_3;
    text-align: center;
    padding: 70px 0;

    >p {
        font-size: 14px;
        color: #888;
        padding-top: 10px;
    }
}

.dependent2 {
    background: $bg_3;
    text-align: center;
    padding: 10px 0;

    >p {
        font-size: 14px;
        color: #888;
        padding-top: 40px;
    }
}

.el-button,
.el-checkbox {
    -ms-user-select: none;
    font-weight: initial;
}

.el-button--primary {
    color: #fff;
    background-color: $bg_1;
    border-color: $bg_1;
}



.imasking {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    display: none;
    transition: .6s;
}

.imak_bg {
    width: 640px;
    position: absolute;
    top: 20%;
    left: 50%;
    margin-left: -370px;
    background: #fff;
}

.imak_h {
    display: flex;
    justify-content: space-between;
    background: $bg_1;
    padding: 15px 20px;

    >span,
    >i {
        display: inline-block;
        vertical-align: middle;
        color: $sc_1;
        font-size: 18px;
    }

    >span {
        font-size: 14px;
    }
}

.statisticsBox {
    display: block;
    opacity: 0;
    visibility: hidden;
}

.statisticsVisible {
    opacity: 1;
    visibility: visible;
}

.classTeest_rPT {
    transition: .5s;
}

.keyword {
    max-width: 220px !important;
}

.keywordBox {
    .el-tag {
        margin-right: 10px;
        border: 0;
        background-color: rgb(239, 246, 255);
        border-radius: 0;
    }
}

.disabledName {
    width: 217px;

    input {
        background: none !important;
    }
}

.mks {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .3);
    opacity: 0;
    visibility: hidden;
    z-index: 9;
    transition: .5s;
    display: none;
}

.ViewBox {
    position: absolute;
    width: 800px;
    top: 10%;
    left: 50%;
    margin-left: -400px;
    background: $bg_3;

    .buttonCSS {
        margin-top: 40px;
    }
}

.ViewH {
    background: #338efc;
    padding: 10px 20px;
    color: #fff;
    line-height: 24px;
    font-size: 14px;

    >i {
        font-size: 18px;
        cursor: pointer;
    }
}

.activerShow,
.activerShow2 {
    transition: .5s;
    opacity: 1;
    visibility: visible;
    display: block;
}

.addAlbum_lsr {
    .el-tabs--card {
        >.el-tabs__header {
            border: 0;
        }

        .el-tabs__nav {
            border: 0;
            border-radius: 4px;
            background: #ecf5ff;
        }
    }

    .el-tabs__new-tab {
        border: 1px solid #338efc;
        color: $sc_6;
    }

    .el-tabs__nav-next,
    .el-tabs__nav-prev {
        font-size: 16px;
        cursor: pointer;
    }
}

.imgPreview {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    margin: 0;

    .el-dialog__body {
        line-height: 0;
    }

}



.FilerViews {
    .pdfView {
        height: 600px !important;
        overflow: hidden;
        overflow-y: auto;
    }

    .el-dialog__header {
        background: $bg_1;

        >span,
        i {
            color: #000;
        }

        i {
            &:hover {
                color: #000;
            }
        }
    }

}

.uploaderList {
    display: none;
}

.i_choiceLs_c {
    margin-left: 20px;
}

.Task_data {
    .detailsTask_info_l {
        width: 400px;
    }
}

.list-msgs {
    margin-top: 30px;

    li {
        line-height: normal;
        padding: 0 0 10px;
        border-bottom: $bd_3;

        >i {
            cursor: pointer;
            opacity: 0;

            &:hover {
                color: red
            }
        }

        &:hover {
            >i {
                opacity: 1;
            }
        }
    }
}

.el-icon-delete {
    cursor: pointer;

    &:hover {
        color: red;
    }
}

.homeworkTask_cp {
    .i_choiceLs {
        >div {
            margin-left: 50px;

        }

    }

    .i_choiceTXT {
        .el-textarea {
            width: 870px;
        }
    }

    .topic_txt {
        >.el-form-item {
            margin-left: 0;
        }

        .el-form-item__label {
            text-align: left;
        }
    }
}

.content_vb {
    display: inline-block;
    vertical-align: top;

    >strong {
        position: absolute;
        right: 30px;
    }
}

#indexNav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: $bg_3;
    z-index: 3;
}


.myGrowth-tabel {
    margin-top: 30px;
}

.myAchievements-h {
    border-bottom: $bd_1;

}

.myAchievements-batle {
    margin-top: 40px;

    >h3 {
        font-size: 16px;
        line-height: normal;
        margin-bottom: 20px;
    }

    >table {
        border: $bd_1;
        width: 100%;

        th,
        td {
            border: $bd_1;
            text-align: center;
            padding: 15px 0;
        }

        th {
            color: #666;
        }
    }
}

.myAchievements-ej {
    text-align: justify;
    text-align-last: justify;
    padding: 15px 0;
    border-bottom: $bd_1;
    display: flex;
    justify-content: space-between;

    >div {
        display: inline-block;
        vertical-align: top;
        text-align: left;
        text-align-last: justify;
        line-height: 46px;

        &:nth-of-type(1) {
            color: #E2AE26;
        }

        &:nth-of-type(2) {
            color: $sc_4;

            span {
                display: inline-block;
                vertical-align: top;
                max-width: 80px;
                @extend .i_text;
            }
        }
    }
}


.myGrowth-chart {
    height: 300px;

    .echarts {
        width: 100%;
    }
}

.questionView {
    padding: 30px;

    .btnCss {

        text-align: center;
        padding-top: 20px;
    }

    .el-tabs__content {
        border-bottom: $bd_1;
    }

    .el-tabs__item {
        font-size: 12px;
    }

    .el-tabs--card>.el-tabs__header .el-tabs__nav {
        border: 0;
        border-radius: 4px;
        background: #ecf5ff;

    }

    .el-tabs__new-tab {
        background: #338efc;
        border-color: #338efc;

        >i {
            color: #fff;
        }
    }
}

.sideLook {
    padding: 30px;

    .sideLook-txt {
        border: 0;
        padding: 0;
        line-height: 30px;
    }

    .el-form-item__label {
        line-height: 30px;
        text-align: left;
    }
}

.checkoutVisible {
    .testVisible {
        padding: 20px;

        >h3 {
            font-size: 16px;
            text-align: center;
            padding: 20px 0;
            line-height: normal;

            >i {
                padding: 0 5px;
                color: red;
            }
        }

        .el-icon-close {
            color: red;
            font-size: 16px;
        }

        .el-icon-check {
            color: #338efc;
            font-size: 16px;
        }
    }
}

.footprint {
    .teachVideo_lsr5 {

        span,
        a {
            color: #000;
            margin-right: 40px;
        }

        >a {
            &:hover {
                color: $sc_6;
            }
        }
    }

    .teachVideo_lsr6 {
        margin-top: 20px;

        >span {
            color: $sc_4;
        }
    }

    .teachVideo_lsr1 {
        font-weight: normal;

        >a {
            font-weight: normal;
        }
    }

    .teachVideo_lsr4,
    .teachVideo_lsr2 {
        margin-top: 15px;
    }

    .classTeest_rTx {
        margin-top: 20px;
    }

    .classTeest_rPB {
        border-bottom: 0;
    }
}

.class-img {
    margin-top: 10px;
    display: inline-block;
    vertical-align: top;
    margin: 0 5px 5px 0;
    width: 140px;
    cursor: pointer;
    height: 140px;
    overflow: hidden;

    >img {
        width: 100%;
        height: 100%;
    }
}

.myCredits {
    background: #FFF7DE;
    border-radius: 3px;
    line-height: 30px;
    font-size: 12px;
    color: #888888;
    padding: 0 22px;

    >i {
        font-size: 18px;
        padding: 0 5px;
        color: #ffca82;
    }
}

.uploader_rsd {
    display: inline-block;
    vertical-align: top;

    .uploader-btn {
        padding: 0;
        border: 0;
    }

    .uploader-file-status {
        opacity: 0;
    }

    .uploader-file-resume {
        display: none !important;
    }
}

.studentCredits-c,
.studentStatistics-c {
    .el-tabs__nav-wrap {
        &:after {
            display: none;
        }
    }

    .el-tabs__item {
        height: auto;
        line-height: 20px;
    }

    .el-tabs__active-bar {
        display: none;
    }

    .el-tabs__header {
        margin: 0;
        padding-bottom: 38px;
    }

    .learn {
        color: $sc_6;
        font-size: 14px;
    }

    .credit-S {
        font-size: 18px;
        color: #EBA300;
    }

    .classLs_4>span:first-of-type {
        color: #666666;
    }
}

.has-gutter {
    th {
        background: #EFEFEF;
    }
}

#e-video,
.publishVideo {


    .publishFrom_ {
        overflow: hidden;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    .dotting_time {
        &:hover {
            .low_source {
                opacity: 1;
                visibility: visible;
            }
        }
    }

    .low_source {
        position: absolute;
        background: #fff;
        width: 150px;
        bottom: 20px;
        left: -75px;
        border-radius: 4px;
        transition: .5s;
        opacity: 0;
        visibility: hidden;

        >p {
            color: #000;
            font-size: 12px;
            text-align: left;
            margin: 0;
            line-height: 24px;
            @extend .i_word;
            padding: 0 5px;
        }

        >img {
            width: 100%;
            margin: 0;
            text-align: left;
        }

        &:after {
            content: '';
            width: 0;
            height: 0;
            border-width: 10px 9px 0;
            border-style: solid;
            border-color: #fff transparent transparent;
            position: absolute;
            bottom: -10px;
            left: 50%;
            margin-left: -6px;
        }
    }

    .addAttachments-c {
        /* .uploader-btn{
      background: $bg_1;
      color: $sc_1;
      text-align: left;
      text-indent: 12px;
    }
    .uploader-file-info{
      >div{
        display: inline-block;
        width: auto;
        margin: 0 10px;
      }
    }
    .uploader-file{
      border-bottom: 0;
    }
    .uploader-file{
      line-height: 40px;
    }
    .uploader-file-icon{
      margin-top: 7px;
    }
    .uploader-file-actions>span{
      margin-top: 12px;
    } */
    }

    .Cutting {
        margin-top: 40px;
    }

    .videoDot {
        .el-input__inner {
            padding-right: 0;
        }
    }

}

.publishVideo {
    .information {
        display: none;
    }
}


.uploaderList {
    position: fixed !important;
    width: 100%;
    height: 100%;
    top: 0 !important;
    ;
    left: 0;
    background: rgba(0, 0, 0, .5) !important;
    z-index: 9;
    opacity: 1;

    ul {
        position: relative;
        top: 300px;
        bottom: 0;
        left: 0;
        right: 0;
        width: 50%;
        margin: auto !important;
        background: #eee;

        >li {
            position: relative;
        }
    }
}

.uploader-file-info {
    position: unset !important;
    z-index: initial !important;

    .uploader-file-actions {
        width: auto !important;
    }

    .uploader-file-name {
        width: 40%;
    }
}


#resourceUpload {
    .uploader-btn {
        width: 80px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        padding: 0;
        border: 0;
        background: $bg_1;
        color: $sc_1;
        border-radius: 3px;
    }
}

.menuLk {
    width: 200px;
    background: #ffffff;
    padding: 20px 0;
    border-radius: 3px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);

    a,
    button {
        display: block;
        text-align: left;
        text-indent: 80px;
        font-size: 14px;
        background: none;
        border: 0;
        outline: none;
        line-height: 56px;
        width: 100%;
    }

    .el-menu-item {
        position: relative;
        padding: 0 !important;

        >i {
            position: absolute;

            &:nth-of-type(1) {
                top: 8px;
                left: 20px;
            }

            &:nth-of-type(2) {
                opacity: 0;
                top: 22px;
                right: 20px;
            }
        }

        >strong {
            position: absolute;
            top: 0;
            right: 43px;
            color: #888;
            font-size: 12px;
        }
    }

    .el-menu {
        border: 0
    }

    .Indexactive {
        background: #E8F2FF;
        color: #000000;
    }

    .Indexactive+.Shape_04 {
        opacity: 1 !important;
    }
}

.U_child {
    margin-bottom: 20px;

    .el-select {
        width: 100px;
        margin-right: 15px;

        .el-input__inner {
            background: #2f6d8c;
            border: #739cb1;
            color: #fff;
            height: 30px;
            line-height: 30px;
            border-radius: 4px;
        }

        .el-input__icon {
            line-height: 30px;
        }
    }

    .el-icon-circle-plus-outline {
        font-size: 26px;
        color: #666;
        vertical-align: top;

        cursor: pointer;
    }
}

.switchingIdentit {
    .identity {
        padding: 40px 50px;
        text-align: center;

        >div {
            text-align: left;
            text-align-last: initial;
            width: 100px;
            text-align: center;
            margin-bottom: 20px;
            display: inline-block;
            vertical-align: top;

            >label {
                display: inline-block;

                width: 60px;
                height: 60px;
                border-radius: 50%;
                overflow: hidden;
                position: relative;
                cursor: pointer;

                >div {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    text-align: center;
                    opacity: 0;
                    visibility: hidden;
                    transition: .5s;
                    z-index: 3;
                    background: rgba(255, 255, 255, .8);

                    >i {
                        color: #33BBBB;
                        font-size: 30px;
                        line-height: 60px;
                    }
                }

                input,
                .el-radio {
                    display: block;
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 0;
                    left: 0;
                    z-index: 6;
                    opacity: 0;
                    margin: 0;
                }

                .is-checked+div {
                    opacity: 1;
                    visibility: visible;
                }

                >img {
                    position: absolute;
                    top: 0;
                    left: 0;
                    z-index: 2;
                }
            }

            p {
                text-align: center;
                padding-top: 15px;
                height: 19px;
                @extend .i_text;

            }
        }
    }

    .el-dialog__footer {
        padding: 0;
        padding-bottom: 30px;
    }
}



.uploader-circle {
    .uploader-list {
        padding-top: 60px;
        display: none;
    }

    .uploader-btn {
        border: 0;
        line-height: 22px;

        .svg-icon {
            vertical-align: top;
        }

        .img_icon {
            width: 18px;
            height: 18px;
        }

        &:hover {
            background: none;
            color: $sc_6;
        }
    }
}

.uploader-cr {
    .uploader-btn {
        border: 0;
        padding: 0;

        >span {
            width: 80px;
            height: 36px;
            line-height: 36px;
            text-align: center;
            background: #ecf5ff;
            color: #807fbc;
            display: inline-block;
            border-radius: 3px;

            &:hover {
                background: $bg_4;
                color: $sc_1;
            }
        }

        >i {
            margin-left: 10px;
            font-size: 12px;
        }

        &:hover {
            background: none;
        }
    }
}


.UpactiveVideo {
    .uploader-list {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3;
        background: rgba(255, 255, 255, .6);

        >ul {
            max-width: 800px;
            margin: 200px auto 0;
        }
    }
}


.UpactiveVideo2 {
    .uploader-list {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 4;

        // pointer-events: none;
        // background: rgba(255,255,255,.6);
        >ul {
            max-width: 800px;
            margin: 250px auto 0;
        }
    }
}

.uploader-broadcast,
.uploader-album {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;

    .uploader-btn {
        border: 0;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: block;
        padding: 0;

        >i {
            margin: 40px 80px;
            opacity: 0;
            visibility: hidden;
            transition: .5s;
        }

        &:hover {
            background-color: rgba(255, 255, 255, .8);

            >i {
                opacity: 1;
                visibility: visible;
            }
        }
    }
}


.addAlbum_x4 {
    position: relative;

    .uploader-btn {
        position: absolute;
        width: 98px;
        height: 40px;
        border-radius: 4px;
        text-align: center;
        line-height: 40px;
        border: 0;
        background: $bg_1;
        padding: 0;
        color: $sc_1;
        top: -40px;
        left: 340px;

        &:hover {
            background: $bg_1;
        }
    }

    .uploader-file {
        .uploader-file-size {
            width: 40%
        }

        .uploader-file-status,
        .uploader-file-resume {
            display: none !important;
        }
    }



}


.activeChat {
    background: $bg_5
}

.objects_rs {
    >a {
        color: $sc_6;
    }

    >span {
        color: $sc_5 !important;
    }
}

.MemberTab {
    margin-top: 20px;

    .el-tabs__nav-wrap {
        &:after {
            display: none;
        }
    }

    .el-tabs__active-bar {
        display: none;
    }

    .el-table th>.cell {
        text-align: center;
    }
}

.activePath {
    display: none;
}

.up_true {
    .el-form-item__label:before {
        content: '*';
        color: #f56c6c;
        margin-right: 4px;
    }
}

.uploader-cp {
    .uploader-btn {
        border: 0;
        padding: 0;
        width: 80px;
        height: 36px;
        color: $sc_1;
        line-height: 36px;
        background: $bg_1;
        border-radius: 4px;
        text-align: center;

        &:hover {
            background: $bg_4;
        }
    }
}

.resources_file {
    .Upactive {
        .uploader-file {
            height: initial;
            background-color: #e2eeff;
            line-height: 34px;
        }

        .uploader-file-icon {
            margin-top: 6px;
        }

        .uploader-file-actions {
            position: absolute;
            top: 0;
            width: 110px;
            right: 0;
            text-align: right;
        }

        .uploader-file-size,
        .uploader-file-meta,
        .uploader-file-status {
            width: auto;
        }

        .uploader-file-progress {
            background-color: #238efc;
        }

        .uploader-file-actions {
            >span {
                margin-top: 6px;
            }
        }
    }
}

.classMembers {
    position: relative;

    .el-tabs__nav-scroll {
        position: absolute;
        top: -120px;
        left: 0;
    }

    .el-tabs__nav-wrap {
        overflow: initial;
    }
}



.el-tooltip__popper {
    max-width: 500px;
    word-wrap: break-word;
    word-break: break-all;
}

#edito {
    position: relative;
}

.masking {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .2);
    z-index: 9;
    display: none;

    .maskingBox {
        width: 800px;
        position: absolute;
        top: 200px;
        left: 50%;
        margin-left: -400px;
    }

    .masking_h {
        background: $bg_1;
        padding: 15px;
        color: $sc_1;

        >span {
            font-size: 14px;
        }

        >i {
            font-size: 18px;
            cursor: pointer;
        }
    }
}

.activeLive {
    display: block;
}

.interceptBtn {

    margin-top: 30px;
}

.child_1,
.child_2 {
    display: inline-block;
    vertical-align: middle;
    width: 50px;
    height: 50px;
    background: url('../../assets/images/icon_wodejiaoan.png');
}

.child_2 {
    background: url('../../assets/images/icon_class.png');
}

.el-tabs__item {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;
    user-select: none;
}

.uploader-enclosure {
    .uploader-btn {
        width: 100px;
        text-align: center;
    }

}

.el-form-item.uploader-file-info {
    &:hover {
        background: #e8f2ff !important;
    }
}

.video_box {
    .video_up {
        margin: 10px 0 10px 0;
    }

}



.nbPeople {
    padding: 30px 0 60px;
}


.pbottom {
    .classSpace_cont {
        padding-bottom: 0;
    }

    .classSpace_link {
        opacity: 0;
    }
}

.teaching_cont2 {
    .u_resourceH {
        padding: 0 40px 20px;
    }


    .classBox,
    .pageing,
    .pageBox {
        padding: 0 40px;
    }

    .class_test {
        padding: 0;

        .i_testTxt {
            padding: 0 40px;
        }
    }
}

.scheduName {
    cursor: pointer;
    display: block;
    height: 40px;
    width: 80px;
    @extend .i_text
}


.lectureList_ {
    .el-form-item__content {
        .el-form-item {
            display: inline-block;
            vertical-align: top;

            &:nth-of-type(1) {
                width: 100px;
            }

            &:nth-of-type(2) {
                width: 150px;
            }
        }
    }
}


.thumbnail {
    margin-top: 30px;

    >div {
        width: 200px;
        height: 200px;
        overflow: hidden;
        display: inline-block;
        vertical-align: top;
        margin: 0 10px 10px 0;
        position: relative;
        overflow: hidden;
        border: 1px solid #DCDCDC;

        >i {
            position: absolute;
            top: 0;
            right: 0;
            padding: 5px;
            background: #ccc;
            color: red;
            cursor: pointer;
        }

        img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }
    }

}


.upload-input {
    width: 200px;
    height: 200px;

    text-align: center;
    line-height: 200px;
    position: relative;

    i {
        font-size: 60px;
        color: #BBC5D5;
    }

    input {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

.cropper_btn {
    padding: 20px 0;
}

.operation-file {
    position: relative;

    .uploader_rsd {
        .uploader-list {
            position: absolute;
            left: -20px;
            top: 20px;
            width: 510px;
        }

        .uploader-file {
            border: none;
        }
    }
}


.emoji_ch {
    position: relative;
    margin-right: 10px;

    >img {
        width: 18px;
        height: 18px;
        cursor: pointer;
    }

    .emoji {
        position: absolute;
        top: 25px;
        left: 0;
        box-shadow: $shadow2;
    }

    .selectEmoji {
        // display: none;
    }

    >input {
        width: 20px;
        height: 20px;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        cursor: pointer;
    }

    input:checked+.selectEmoji {
        display: block;
    }
}

.el-message-box__wrapper {
    .el-message-box__header {
        display: none;
    }
}

.selectEmoji2 {
    position: absolute;
    top: -208px;
    ;
    left: 280px;
    box-shadow: $shadow2;
}


.Tailoring {
    .el-dialog__header {
        display: none;
    }
}

#notice {
    padding: 30px 0;
    height: calc(85.3vh - 60px);
    overflow: hidden;
    position: relative;
    min-height: 736px;

    .el-pagination {
        padding: 0 40px;
        overflow: hidden;
    }
}

.notice_title {
    background: $bg_3;
    border-bottom: 2px solid #EBEBEB;
    padding: 30px 0 14px;
    // height: 28px;
    line-height: 28px;
    overflow: hidden;
}

.notice_title_l {
    width: 180px;
    // text-align: center;
    font-size: 14px;
    color: #D89705;
    text-indent: 40px;
}

.notice_title_r {
    margin-left: 220px;
}

.notice_main {
    background: $bg_3;
    height: calc(100% - 74px);
    box-shadow: $shadow2;
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    width: 100%;
}

.notice_nav {
    width: 180px;
    height: 100%;
    background-image: linear-gradient(-180deg, #F3FAFF 0%, #F2F9FF 100%);
}

.notice-c {
    height: 100%;
    min-height: 653px;
    margin-left: 180px;
}

.notice_link {
    .item {
        display: block;

        >a {
            text-indent: 40px;
            display: block;
            height: 50px;
            line-height: 50px;
            font-size: 14px;
            position: relative;
        }
    }

    .showActive {
        background: #D1E6FF;
    }

    .el-badge__content.is-fixed {
        top: 25px;
        right: 45px;
    }

    .num_s {
        position: absolute;
        top: 14px;
        right: 10px;
        line-height: initial;
        display: block;
        background-color: #f56c6c;
        border-radius: 10px;
        color: #fff;
        display: inline-block;
        font-size: 12px;
        height: 18px;
        line-height: 18px;
        padding: 0 6px;
        text-align: center;
        white-space: nowrap;
        text-indent: 0;
    }
}

.notice_type {
    position: absolute;
    top: 60px;
    right: 40px;
    line-height: 30px;
    width: 74%;
}

.notice_type_op {


    >label {
        margin-right: 20px;
        cursor: pointer;
        position: relative;

        >input {
            display: none;
        }

        >input:checked+span {
            color: $sc_6;
        }

        >i {
            right: -8px;
            top: -18px;
            position: absolute;
            display: block;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            overflow: hidden;
            background: #f56c6c;
            line-height: 20px;
            text-align: center;
            color: #fff
        }

        &:last-of-type {
            margin-right: 0;
        }
    }

    .el-input__icon {
        line-height: 30px;
        border-radius: 3px;
    }
}



.mesg_list {
    padding: 30px 40px;

    .el-checkbox {
        display: block;

        .el-checkbox__input {
            vertical-align: top;
            margin-top: 30px;
        }
    }

    .el-checkbox__label {
        width: 95%;
    }

    .el-checkbox+.el-checkbox {
        margin-left: 0;
    }
}

.noticeLs {
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid #EBEBEB;
    margin-bottom: 20px;
    padding-left: 10px;

    .item {
        // position: absolute;
        // left: 0;
        // top: 0;
    }

    .el-checkbox__label {
        display: none;
    }

    &:last-of-type {
        margin-bottom: 0;
    }

    &:hover {
        .noticeLs_1_operation {
            opacity: 1;
            visibility: visible;
        }
    }
}

.isWidth {
    margin-left: 40px;
    // @extend .i_transition;
}

.noticeLs_1_operation {
    position: absolute;
    top: 0;
    right: 0;
    @extend .i_transition;
    opacity: 0;
    visibility: hidden;

    button {
        background: #348EFC;
        border-radius: 3px;
        width: 70px;
        height: 30px;
        height: 30px;
        border: 0;
        outline: none;
        text-align: center;
        color: $sc_1;
        font-size: 12px;
        margin-left: 15px;
        padding: 0;
        margin-top: 0;
    }


}

.noticeLs_1 {
    line-height: 18px;
    margin-bottom: 10px;
    height: 18px;

    // overflow: hidden;
    // position: relative;
    >i {
        background: #F4AD0D;
        display: inline-block;
        vertical-align: top;
        color: $sc_1;
        font-weight: bold;
        padding: 3px;
        border-radius: 2px;
        overflow: hidden;
        line-height: 1;
        font-size: 12px;
    }

    >span {
        color: #F4AD0D;
        font-size: 12px;
    }

    .mesg_time {
        color: #666;
        font-size: 12px;
        line-height: 30px;
    }

    .el-badge__content.is-dot {
        height: 5px;
        width: 5px;
    }


}

.noticeLs_2 {
    color: #666;
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 14px;

    >span {
        margin-right: 15px;
    }

}

.noticeLs_3 {
    font-size: 14px;
    line-height: 19px;
    margin-bottom: 19px;
    @extend .i_text;
}

.isLink {
    // display: none;
}

.mesg_user {
    margin-left: 5px;

    >span {
        display: inline-block;
        vertical-align: top;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        overflow: hidden;

        >img {
            width: 100%;
            height: 100%;
        }
    }

    >i {
        line-height: 30px;
        margin: 0 10px;
        font-size: 12px;
    }
}

.new_icn {
    background-image: url('../../assets/images/new.png');
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}

.left_1 {
    cursor: pointer;
    background-position: -84px 0px;
    width: 8px;
    height: 16px;

    &:hover {
        background-position: -56px -57px;
    }
}


.Shape {
    background-position: 0px 0px;
    width: 18px;
    height: 19px;

    &:hover {
        background-position: -28px 0px;
    }
}


.Shape3 {
    background-position: 0px -57px;
    width: 18px;
    height: 17px;

    &:hover {
        background-position: -28px -57px;
    }
}


.bianji {
    background-position: -56px 0px;
    width: 18px;
    height: 18px;

    &:hover {
        background-position: 0px -29px;
    }
}


.dele_1 {
    background-position: -28px -29px;
    width: 18px;
    height: 18px;

    &:hover {
        background-position: -56px -29px;
    }
}

.notice_type_check_1 {
    width: 300px;
    height: 31px;
    overflow: hidden;

    >i {
        margin-right: 20px;
        cursor: pointer;
    }

    >div {
        width: 0;

        overflow: hidden;
        @extend .i_transition;

        >span {
            margin-right: 20px;

        }
    }

    .notice_m {
        width: 152px;
    }
}

.follow {
    .noticeLs_1 {
        height: auto;
    }
}

.del_new {
    .el-dialog__body {
        padding: 30px 40px;

        .el-radio+.el-radio {
            margin: 20px 0 0;
        }
    }

    .buttonCSS {
        margin-top: 50px;
    }
}


.resources_upfile {
    display: none;
}


.Administration {
    padding: 20px;

    ul {
        border-bottom: $bd_1;
        margin-bottom: 20px;
    }

    .el-tabs {
        min-height: 350px
    }
}

.Administration_title {
    margin-bottom: 20px;
    color: #666;

}

.Administration_ls {
    width: 80px;
    float: left;
    margin: 0 15px 15px 0;

    >p {
        text-align: center;
        margin-top: 5px;
        font-size: 12px;
        @extend .i_text;
        height: 20px;
        line-height: 20px;
    }

    &:hover {
        .Administration_ls_icn>div {
            visibility: visible;
            opacity: 1;
        }
    }
}

.Administration_ls_icn {
    position: relative;
    width: 80px;
    height: 80px;

    >img {
        width: 100%;
        height: 100%;
    }

    >div {
        background: rgba(0, 0, 0, .5);
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        text-align: center;
        @extend .i_transition;
        opacity: 0;
        visibility: hidden;

        >i,
        span {
            display: block;

            color: #fff;
            font-size: 14px;
        }

        >i {
            font-size: 30px;
            margin: 20px 0 10px;
            cursor: pointer;
        }
    }
}

.classTeest_rM_rsd {
    background: #f5f5f5;
    padding: 20px;

    >img {
        float: left;
    }

    >div {
        margin-left: 80px;
        line-height: 40px;

        >span {
            max-width: 80%;
            @extend .i_text;
            font-size: 14px;
            color: #666;
        }

        >a {
            float: right;
            color: $sc_6
        }
    }
}

.classTeest_link {
    background: #f5f5f5;
    padding: 20px;
    display: flex;
    align-items: center;

    // >img{
    //  float: left;
    // }
    >div {
        margin-left: 20px;
        @extend .i_word;
        max-height: 39px;
        overflow: hidden;

        >a {
            color: $sc_5;
            font-size: 14px;

            &:hover {
                color: #338efc;
            }

        }
    }
}

.uploader_rsd,
.uploader_om {
    margin-right: 8px;
}

.video-close {
    position: relative;

    .el-icon-close {
        font-size: 18px;
        position: absolute;
        top: 0;
        cursor: pointer;

        &:hover {
            color: red
        }
    }
}

.i-link {
    width: 18px;
    height: 18px;
    cursor: pointer;
    background: url('../../assets/images/lianjie.png');
}

.i-link-url {
    margin-top: 25px;

    >div {
        position: relative;
        margin-bottom: 20px;
        font-size: 0;

        >span {
            position: absolute;
            left: 5px;
            top: 45px;
            color: red;
            font-size: 12px;
        }

        input {
            font-size: 14px;
        }

        &:nth-of-type(2) {
            >.el-input {
                width: 90%;
                vertical-align: top;

                input {
                    border-right: none;
                }
            }

            >i {
                font-size: 14px;
                width: 10%;
                line-height: 40px;
                text-align: center;
                color: #666;
                cursor: pointer;
                background: #E8F2FF;
                transform: rotate(180deg);
                -webkit-transform: rotate(180deg);
                -moz-transform: rotate(180deg);
                -o-transform: rotate(180deg);
                -ms-transform: rotate(180deg);
            }
        }
    }
}

.file-uploaders {

    >.el-form-item__content {
        position: relative;
    }

    .el-icon-close {
        position: absolute;
        top: 8px;
        right: 10px;
        font-weight: bold;
        font-size: 16px;
        color: #999;
    }

    .uploader-btn {
        background: #fff;
        border-color: #ddd;

        &:hover {
            background: #348efc;
            color: #fff;
        }
    }

    .uploader-list {
        display: inline-block;
        vertical-align: top;
        width: 500px;
    }

    .uploader-file-icon {
        margin: 0 10px 0 8px;
        display: inline-block;
        width: 20px;
        background-image: url('/../images/format/resourceicon1.png');
        background-size: 100% 100%;

        &:before {
            display: none;
        }
    }

    .uploader-file {
        height: 32px;
        line-height: 32px;
        border: none;
    }

    .uploader-file-actions>span {
        margin-top: 8px;
    }

    .uploader-file-remove,
    .uploader-file-status,
    .uploader-file-actions {
        display: none !important;
    }

    .syllabusList {
        height: 32px;
        line-height: 32px;

        >img {
            width: 20px;
            margin: 0 10px 0 20px;
            vertical-align: middle;
        }

        span {
            display: inline-block;
            vertical-align: top;
            width: 360px;
            @extend .i_text;
        }

        strong {
            margin-right: 5px;
            display: inline-block;
            vertical-align: top;
            @extend .i_text;
            width: 100px;
            color: #999;
            font-size: 12px;
        }

        i {
            color: #999;
            cursor: pointer;

            &:hover {
                color: red
            }
        }
    }
}

.standard-file {
    .el-form-item__label {
        line-height: 22px;
    }
}

.is_ai {
    overflow: hidden;
    // margin-bottom: 40px;

    >.el-form-item {
        display: inline-block;
        vertical-align: top;

        &:nth-of-type(2) {
            float: right;
        }
    }
}

.edit-div {
    width: calc(100% - 20px);
    padding: 10px;
    height: 120px;
    overflow: auto;
    word-break: break-all;
    outline: none;
    user-select: text;
    white-space: pre-wrap;
    text-align: left;
    border: 1px solid #eee;

    &[contenteditable=true] {
        user-modify: read-write-plaintext-only;
        -webkit-user-modify: read-write-plaintext-only;

        &:empty:before {
            content: attr(placeholder);
            display: block;
            color: #ccc;
        }
    }
}

.uploader-broadcast {
    position: relative;

    .uploader-file-progress,
    .uploader-file-name,
    .uploader-file-size,
    .uploader-file-meta,
    .uploader-file-status,
    .uploader-file-actions span {
        display: none;
    }

    .uploader-file {
        border: 0;
    }

    .uploader-file-actions {
        float: right;
    }

    .uploader-file-remove {
        display: block !important;
        margin: 0;
        // position: absolute;
        // right: 0;
        // top: 0;
    }

    .uploader-list,
    .uploader-file,
    .uploader-file-info {
        &:hover {
            background: none;
        }
    }
}


.uploader-msg,
.uploader-example-video {
    position: absolute !important;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;

    .uploader-list {
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }

    .uploader-file {

        border: none;
        line-height: initial;
        height: 20px !important;
        ;
        border-radius: 10px;
        background: #e2e2e2;
        position: absolute;
        top: 50%;
        width: 100%;
        margin-top: -10px;
    }

    .uploader-file-progress {
        background: $bg_1;
    }

    .uploader-btn {
        padding: 0;
        width: 100%;
        height: 100%;
        border: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 5;
        text-align: center;

        i {
            margin-top: 35px;
            position: 0;
            visibility: hidden;
        }

        &:hover {
            i {
                opacity: 1;
                visibility: visible;
            }
        }
    }

    .uploader-file-icon,
    .uploader-file-name,
    .uploader-file-meta {
        display: none !important;
    }

    .uploader-file-info {
        div {
            font-size: 12px;
            display: inline-block;
            line-height: 20px;
        }
    }

    .uploader-file-status {
        width: 60%;
        text-indent: 0;
        @extend .i_text;

        i {
            display: none;
        }
    }

    .uploader-file-size {
        text-indent: 0;
        width: 25% !important;
        ;
    }

    .uploader-file-actions {
        width: 10%;
        position: absolute;
        top: 0;
        right: 0;

        >span {
            margin: 0 !important;
        }
    }
}

.el-form-item.is-success .el-input__inner,
.el-form-item.is-success .el-input__inner:focus,
.el-form-item.is-success .el-textarea__inner,
.el-form-item.is-success .el-textarea__inner:focus {
    border-color: #338efc;
}

.privateLetteBox {
    padding: 0;
    height: 720px;

    >div {
        height: 680px;
        overflow: hidden;
    }

    .content_r {
        width: 680px;
    }

    .communicationBox {
        height: 100%;
    }

    .communication_c {
        height: calc(100% - 52px);
    }

    // .usetInfo{
    //  height: 100%;
    // }
    // .u_chat {
    //     height: calc(100% - 108px);
    // }
}


.el-textarea__inner {
    border-radius: 4px;
}


.Reply_2-more {
    text-align: right;

    span {
        &:nth-of-type(2) {
            color: #348efc;
            cursor: pointer;
        }

        i {
            transform: rotate(180deg);
        }

    }

    .arrow-up {
        transform: rotate(0deg);
    }
}


.attach-url {

    a {
        display: inline-block;
        line-height: 30px;
        // width: 100px;
        background: $bg_1;
        color: #fff;
        text-align: center;
        border-radius: 3px;
        padding: 0 5px;
    }
}


.parent-select {
    .select-p1 {
        margin: 0 0 15px 15px;

        .el-input__inner {
            background: #2f6d8c;
            border: #739cb1;
            color: #fff;
            height: 32px;
            line-height: 32px;
        }

        .el-input__icon {
            line-height: 32px;
        }
    }

    .select-p2 {
        .el-input.is-disabled .el-input__inner {
            background-color: #fff;
            color: #666;
            cursor: default;
        }

        .el-input__suffix {
            display: none;
        }
    }
}

.uploaders-input {
    position: relative;
    color: #666;
    border: 1px solid #eee;
    width: 88px;
    height: 29px;
    line-height: 29px;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;

    >input {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
    }

    &:hover {
        background: #409EFF;
        color: #fff;
    }
}

.zh-archives-edit {
    position: relative;

    .error-tips-info>input {
        border: 1px solid red !important;
    }

    .el-input__icon {
        line-height: 32px;
    }

    .el-tabs--card>.el-tabs__header {
        border: 0;
        margin-bottom: 40px;
    }

    .el-tabs__nav-scroll {
        text-align: center;

        >div {
            width: 400px;
            display: inline-block;
            float: initial;
            border: 1px solid #e4e7ed !important;
            border-radius: 4px !important;
        }

        .el-tabs__item {
            padding: 0;
            width: 99px;
        }

        .is-active {
            background: #409EFF;
            color: #fff;
            padding: 0 !important;
        }

    }

    .el-tabs--card>.el-tabs__header .el-tabs__item {
        border-right: 1px solid #e4e7ed;

        &:last-of-type {
            border: 0
        }
    }

    .file-header-btn {
        position: absolute;
        top: 75px;
        right: 40px;
        z-index: 999;

        button {
            padding: 8px 19px;
            font-size: 14px;
        }
    }

    .tab-title:before {
        content: '';
        display: inline-block;
        margin-right: 8px;
        margin-bottom: -3px;
        width: 5px;
        height: 16px;
        background: #33bbbb;
        border-radius: 5px;
    }

    .tab-title {
        font-weight: bold;
    }

    .tab-title:after {
        content: '';
        position: absolute;
        top: 24px;
        left: 96px;
        width: calc(100% - 96px);
        height: 1px;
        border-top: 1px dashed #ccc;
    }

    .file-base-photo {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 35px 0 20px;
        margin: 30px 0 30px;
        width: 100%;
        height: 120px;
        background-image: linear-gradient(-180deg, #87d1fe 0%, #aedaff 100%);
        box-sizing: border-box;

        .presonPic {
            display: flex;
            align-items: center;


            >img {
                margin-right: 15px;
                margin-top: -10px;
                width: 70px;
                height: 84px;
                border: 2px solid rgba(255, 255, 255, 0.50);
                // object-fit: contain;
                // border-radius: 50%;
                box-sizing: border-box;
                background: #fff;
            }


            >div {
                .name-pinyin {
                    >span {
                        display: inline-block;
                        height: 35px;
                        line-height: 35px;
                        margin-top: -10px;
                        font-size: 14px;

                        i {
                            margin-left: 5px;
                            cursor: pointer;
                        }

                        span {
                            font-size: 14px;
                            color: #4C769C;
                        }
                    }

                    >span:last-child {
                        margin-left: 10px;
                    }

                    >div {
                        width: 160px;
                        display: inline-block;
                        vertical-align: top;

                        .el-input__inner {
                            height: 24px;
                            line-height: 24px;
                        }
                    }

                    >div:last-child {
                        margin-left: 10px;
                    }

                    .pinyin-edit {
                        span {
                            color: #333;
                        }

                        input {
                            width: 150px;
                            margin-right: 5px;

                            &:disabled {
                                background: #0000;
                                border: 0;

                            }
                        }

                    }
                }

                .el-input {
                    margin-top: 0;

                    .el-input-group__append {
                        padding: 0;

                        span {
                            padding: 6px 6px;
                            cursor: pointer;
                        }
                    }
                }

                >div {
                    // margin-top: 12px;

                    .uploader-btn {
                        padding: 7px 12px;
                        border-radius: 4px;
                        font-size: 12px;
                        color: #fff;
                        background: #348EFC;
                        border: none;
                        position: unset;
                        width: 60px;
                        height: 30px;
                        line-height: 30px;
                        padding: 0;
                        text-align: center;
                    }
                }
            }
        }

        >div:last-child {
            display: flex;
            align-items: center;
            flex-direction: column;

            img {
                width: 58px;
                height: 68px;
                object-fit: contain;
            }

            span {
                margin-top: 5px;
                padding: 2px 11px;
                font-size: 12px;
                color: #FFFFFF;
                background: #699AE4;
                border-radius: 100px 20px 100px 20px;
            }
        }
    }

    .file-base-info {
        display: flex;
        flex-wrap: wrap;

        // justify-content: space-between;
        >div {
            display: flex;
            align-items: baseline;
            margin-bottom: 20px;
            width: 100%;
            justify-content: center;

            >span {
                width: 170px;
                font-size: 14px;
                color: #333333;
            }

            >div {
                width: 320px;
                text-align: left;

                .el-input__inner {
                    border-radius: 0;
                    height: 32px;
                    line-height: 32px;

                    &:disabled {
                        color: #666;
                    }
                }
            }
        }
    }

    .file-family-info {
        .family-info-active {
            border: 1px solid #4B9BFC !important;
        }

        .file-family-info-title {
            position: relative;
            display: flex;
            flex-wrap: wrap;
            // margin-top: 30px;
            min-height: 40px;
            border: 1px solid #DDDDDD;
            box-sizing: border-box;
            padding-right: 80px;

            >span {
                position: absolute;
                right: 10px;
                font-size: 14px;
                color: #348EFC;
                line-height: 40px;
                cursor: pointer;
            }

            >div {
                display: flex;
                justify-content: space-around;
                align-items: center;
                width: 110px;
                color: #6E6E6E;
                height: 40px;
                line-height: 40px;
                border-right: 1px solid #DDDDDD;
                box-sizing: border-box;
                border-bottom: 1px solid #ddd;

                i {
                    font-size: 15px;
                    color: red;
                    cursor: pointer;
                }
            }
        }

        .file-family-info-box {
            display: flex;
            flex-wrap: wrap;

            >div {
                margin-top: 20px;
                padding: 27px 20px;
                width: calc(100%);
                // max-width: 680px;
                background: #F6F8FA;
                border: 1px solid transparent;
                box-sizing: border-box;

                >div {
                    display: flex;
                    align-items: baseline;
                    margin-bottom: 20px;
                    justify-content: center;

                    >span {
                        display: inline-block;
                        width: 170px;
                        font-size: 14px;
                        color: #333333;
                        vertical-align: top;
                    }

                    >div {
                        flex: 1;
                        max-width: 320px;
                        text-align: left;
                    }
                }

                .el-input__inner {
                    line-height: 32px;
                    height: 32px;
                    border-radius: 0;

                    &:disabled {
                        color: #666;
                    }
                }
            }

            // >div:nth-child(2n + 1) {
            //     margin-right: 10px;
            // }

            // >div:nth-child(2n) {
            //     margin-left: 10px;
            // }
        }
    }

    .file-source-info,
    .file-other-info {
        // margin-top: 38px;

        >div {
            display: flex;
            align-items: baseline;
            margin-bottom: 20px;
            justify-content: center;

            >span {
                display: inline-block;
                width: 170px;
                font-size: 14px;
                color: #333333;
                vertical-align: top;
            }

            >div {
                width: 320px;
                text-align: left;

                .el-input__inner {
                    line-height: 32px;
                    height: 32px;
                    border-radius: 0;

                    &:disabled {
                        color: #666;
                    }
                }
            }
        }
    }
}

.zh-open-right {

    button,
    a {

        padding: 0;
        width: 80px;
        height: 32px;
        line-height: 32px;
        text-align: center;
        background: #338efc;

    }

    a {
        font-size: 14px;
        border-radius: 4px;
        color: #fff;
        display: inline-block;
        vertical-align: top;
        margin-left: 10px;
    }
}

.zh-open-left {
    .el-input {
        width: 300px;

        input {
            height: 32px;
            line-height: 32px;
            border-radius: 0;
        }
    }

    .el-icon-search {
        color: #fff;
        background: #348efc;
    }

    .el-input__suffix {
        width: 44px;
        right: 0;

        text-align: center;
        cursor: pointer;

        .el-input__icon {
            width: 100%;
            line-height: 32px;
        }

        &:hover {
            background: #338efc;

            i {
                color: #fff
            }
        }
    }
}

.zh-table-open {
    margin-bottom: 22px;
}


.archives-btn {
    position: absolute;
    right: 0;
    top: 0;

    button {
        padding: 0;
        width: 70px;
        height: 32px;
        line-height: 32px;
        text-align: center;

    }
}


.uploader-image {
    .uploader-box {
        .uploader-inner {
            display: inline-block;

            .uploader {
                width: 245px;
                height: 160px;
                border: 1px solid #ddd;
                border-radius: 4px;
                overflow: hidden;

                .uploader-btn {
                    border: none;
                    width: 100%;
                    height: 100%;
                    padding: 0;
                    text-align: center;

                    i {
                        font-size: 80px;
                        color: #9cd1ff;
                        margin-top: 45px;
                    }

                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: contain;
                    }
                }

                .uploader-close-box {
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;

                    .el-upload-list__item-status-label {
                        display: block;
                        position: absolute;
                        right: -17px;
                        top: -7px;
                        width: 46px;
                        height: 26px;
                        background: #13ce66;
                        text-align: center;
                        transform: rotate(45deg);
                        box-shadow: 0 1px 1px #ccc;

                        .el-icon-check {
                            font-size: 12px;
                            margin-top: 12px;
                            color: #fff;
                            transform: rotate(-45deg);
                            font-family: 'element-icons' !important;
                            speak: none;
                            font-style: normal;
                            font-weight: normal;
                            font-variant: normal;
                            text-transform: none;
                            line-height: 1;
                            vertical-align: baseline;
                            display: inline-block;
                            -webkit-font-smoothing: antialiased;
                        }

                        // .el-icon-check:before {
                        //   content: "\E611";
                        // }

                        .el-icon-close {
                            display: none;
                        }
                    }
                }

                .uploader-close-box:hover {
                    .el-upload-list__item-status-label {
                        top: -4px;
                        right: -15px;
                        background: #f56c6c;
                        box-shadow: none;
                        cursor: pointer;

                        .el-icon-check {
                            display: none;
                        }

                        .el-icon-close {
                            position: absolute;
                            transform: rotate(-45deg);
                            top: 10px;
                            color: #fff;
                            right: 14px;
                            font-family: 'element-icons' !important;
                            speak: none;
                            font-style: normal;
                            font-weight: normal;
                            font-variant: normal;
                            text-transform: none;
                            line-height: 1;
                            vertical-align: baseline;
                            display: inline-block;
                            -webkit-font-smoothing: antialiased;
                        }

                        // .el-icon-close:before {
                        //   content: "\E60F";
                        // }
                    }
                }

                .uploader-list {
                    position: relative;
                    height: 100%;
                    background: rgba(0, 0, 0, 0.4);

                    .uploader-file {
                        position: relative;
                        width: 76%;
                        height: 100%;
                        margin: 0 auto;
                        border-bottom: none;
                        overflow: hidden;
                    }

                    .uploader-file-progress {
                        height: 10px;
                        top: 58px;
                        background: #3ce642;
                    }

                    .uploader-file-info {
                        height: 49px;
                        line-height: 49px;
                        margin-top: 60px;
                        font-size: 12px;
                        color: #fff;
                        z-index: 1;
                    }

                    .uploader-file-name,
                    .uploader-file-meta {
                        display: none;
                    }

                    .uploader-file-size {
                        width: 40%;
                        text-indent: 0;
                    }

                    .uploader-file-status {
                        width: 48%;
                        text-indent: 0;
                    }

                    .uploader-file-actions {
                        .uploader-file-remove {
                            position: absolute;
                            width: 24px;
                            height: 24px;
                            line-height: 24px;
                            border-radius: 50%;
                            color: #fff;
                            text-align: center;
                            margin: 0;
                            background: #ef5c5c;
                            top: 50%;
                            transform: translateY(-50%);

                            &::before {
                                display: inline-block;
                                content: "x";
                            }
                        }
                    }
                }
            }
        }

        .video-uploader {
            .uploaderList {
                z-index: 10;
            }
        }
    }
}




.livePassword {
    .cipherTips {
        color: #999;
        font-size: 12px;
    }
}

.liveCipher {
    .el-form-item__content {
        .el-input {
            width: 240px;
        }

        .el-icon-view {
            font-size: 16px;
            color: #999;
            margin-left: 10px;
            cursor: pointer;

            &:hover {
                color: #348efc
            }
        }

        .viewTrue {
            color: #348efc
        }
    }
}

.setliveCipher {
    >.el-form-item {
        margin-bottom: 20px;
    }
}

.cipherChecked {
    border-radius: 3px;
    background: #338efc;
    padding: 4px 10px;

    .el-checkbox__input {
        display: none;
    }

    .el-checkbox__label {
        padding: 0;
    }

    .el-checkbox,
    .el-checkbox__input.is-checked+.el-checkbox__label {
        color: #fff;
    }
}

.el-form-item__label {
    text-align: left;
}

.allClass {
    .el-tree-node__content {
        height: 30px;
        line-height: 30px;
    }
}


.calssArray {
    .el-checkbox-group {
        display: none;
    }
}

.jurisdiction {
    >label {
        &:after {
            display: block;
            content: "(谁不能查看)";
            font-size: 12px;
            color: #999;
            line-height: 16px;
        }
    }
}



.roleArray,
.gradeArray {
    >.el-form-item__content {

        background: rgba(253, 253, 253, 1);
        border: 1px solid rgba(239, 239, 239, 1);

    }

    .el-scrollbar {
        .el-scrollbar__wrap {
            height: 80px;
            padding: 15px 40px 30px;
        }

        .el-checkbox-group {
            line-height: initial;
        }

        label {
            margin-top: 20px !important;
            line-height: 20px;
        }
    }

}


.calssArray-wp {
    display: flex;
    flex-flow: row;
    border: 1px solid rgba(239, 239, 239, 1);
    height: 315px;

    .el-tree {
        width: 200px;
        height: 100%;
        overflow: hidden;
        overflow-y: auto;
        border-right: 1px solid rgba(239, 239, 239, 1);

        >.el-tree-node {
            >.el-tree-node__content {
                line-height: 36px;
                height: 36px;
                background: rgba(237, 237, 237, 1);
                border: 1px solid rgba(239, 239, 239, 1);
            }

        }
    }

    .calssArray-r {
        flex: 1;

        >h3 {
            height: 46px;
            line-height: 46px;
            margin: 0 10px;
            color: rgba(102, 102, 102, 1);
            border-bottom: 1px dashed #eee;
        }

        .el-scrollbar {
            height: calc(100% - 46px);

            li {
                margin: 0 10px;
                border-bottom: 1px dashed #eee;

                >h3 {
                    font-size: 14px;
                    line-height: 44px;
                    padding-left: 10px;
                }

                span {
                    display: inline-block;
                    vertical-align: top;
                    height: 20px;
                    line-height: 20px;
                    margin: 0 30px 0 15px;

                    i {
                        margin-left: 5px;
                        cursor: pointer;

                        &:hover {
                            color: #f56c6c;
                        }
                    }
                }
            }
        }
    }

}


.classArray-xx {
    .allClass {
        display: none;
    }
}

.hidden-header {

    #nav,
    #footer,
    .classSpace_link {
        display: none;
    }

    .i_maxW {
        max-width: 100%;
        padding: 0 !important;
    }

    .classSpace_cont {
        width: 100%;
        background: none;
        padding: 0;
        box-shadow: none;
    }

    .maxW {
        max-width: 1200px;
        margin: auto;
    }

    .ql-editor {
        min-height: 100px;
    }

    .knowledge-score {

        .el-input {
            width: 100px;
        }
    }

    .knowledge-answer>div {
        height: max-content;
    }

    .result-submit {
        button {
            padding: 8px 12px;
        }
    }

    .exercises-time-countdown>strong {
        margin: 0 12px;
    }


}


.exercises-list-li {
    width: 42.5%;
    margin: 0 20px 20px 0;
    border: 1px solid #eee;

    &:nth-of-type(2n) {
        margin: 0 0 20px 0;
    }

    &:nth-of-type(3n) {
        margin: 0 20px 20px 0;
    }

    a,
    p {
        margin-bottom: 30px;
    }

    .task-count {
        font-size: 12px;
        text-align: left;
        color: #999999;
        line-height: 2;
        width: 40%;
    }


}

.preview-subject-title {
    .el-checkbox {
        margin-right: 10px;

        &:last-of-type {
            margin-right: 10px;
        }
    }
}


.quality-route {
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;

    a {
        font-size: 14px;
        color: #666666;
        margin-right: 40px;

        &:hover {
            color: #287FEA;
        }
    }

    .showActive {
        color: #287FEA;
    }
}

.quality-seleter {
    border: 1px solid #eee;
    width: 340px;
    height: 44px;
    line-height: 44px;
    border-radius: 4px;
    display: flex;
    flex-flow: row;
    margin: 30px 0;

    >span {
        font-size: 14px;
        padding-left: 10px;
    }

    .el-select {
        flex: 1;

        .el-input__inner {
            border: 0
        }
    }
}

.quality-statistics {
    .quality-title {
        padding: 25px 0;
        border-top: 1px solid #E6E6E6;

        >span {
            font-size: 14px;
            color: #000000;
            margin-left: 10px;
            font-weight: bold;
        }
    }
}

.IEcharts {
    display: flex;
    flex-flow: row;
    margin-bottom: 30px;

    .quality-echart {
        width: 340px;
        height: 340px;
        background: #F5FBFD;
        margin-right: 30px;
    }

    .quality-speed {
        flex: 1;

        li {
            display: flex;
            flex-flow: row;
            margin: 20px 0 35px;

            >span {
                font-size: 12px;
                color: #666666;
                margin-right: 25px;
                width: 60px;
            }

            .el-progress {
                flex: 1;
            }

            .el-progress-bar__outer {
                background: #DDF0F6;
                border-radius: 0;
            }

            .el-progress-bar__inner {
                border-radius: 0;
                background: #00A9E3;
            }

            .el-progress__text {
                display: none;
            }

            .el-progress-bar {
                padding-right: 10px;
            }

            >i {
                font-size: 12px;
                color: #666666;
            }
        }

    }

}


.IEcharts2 {
    height: 310px;
    margin-bottom: 30px;
}


.quality-link {
    display: flex;
    justify-content: space-between;

    a {
        display: block;
        width: 80px;
        height: 36px;
        line-height: 36px;
        background-color: #348EFC;
        color: #fff;
        text-align: center;
        border-radius: 3px;
    }
}


.quality-state {
    overflow: hidden;
    margin-bottom: 30px;

    >.el-select {
        width: 100px;

        margin-right: 20px;

        .el-input__inner {
            border-radius: 4px;
        }
    }

    >.el-input {
        width: 200px;

        .el-input__inner {
            border-radius: 20px;
        }
    }

    .quality-download {
        float: right;
        display: block;
        width: 80px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        background: #D5E8FF;
        border-radius: 3px;
        font-size: 14px;
        color: #4D8FCC;
    }
}


.quality-page {

    .el-pagination__total,
    .el-pagination__sizes,
    .el-pagination__jump {
        display: none !important;
    }
}


.quality-tips {
    margin-top: 10px;
    font-size: 12px;
    color: #D28541;
    background: #FFFDED;
    line-height: 26px;
    padding: 0 10px;
    display: inline-block;
    vertical-align: top;
}

.evaluate-table {
    table {
        border: 1px solid #DDDDDD;
        width: 100%;
        line-height: 36px;

        thead {
            background: #F2F2F2;

            th {
                text-align: center;
            }
        }

        td {
            border: 1px solid #DDDDDD;
            box-sizing: border-box;
            text-overflow: ellipsis;
            vertical-align: middle;

            /* &:nth-of-type(1){
        width: 90px;
      }
      &:nth-of-type(2){
        width: 80px;
      }
      &:nth-of-type(3){
        width: 370px;
      }
      &:nth-of-type(4){
        width: 90px;
      } */
            >div {
                box-sizing: border-box;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: normal;
                word-break: break-all;
                line-height: 24px;
                padding: 5px;
            }

            .el-input__inner {
                padding: 0;
                text-indent: 10px;
                border-color: #0000;

                &:focus {
                    border-color: #287FEA;
                }
            }
        }
    }
}


.evaluate-comment {
    margin-top: 40px;

    >h3 {
        font-size: 14px;
        color: #000000;
        font-weight: bold;
    }
}

.evaluate-txt {
    position: relative;
    margin: 10px 0 40px;

    >span {
        position: absolute;
        right: 5px;
        bottom: 5px;
        font-size: 12px;
        color: #999;

        i {
            color: #333;
        }
    }

    .el-textarea__inner {
        border-radius: 0
    }
}

.evaluate-btn {
    text-align: center;

    button {
        width: 196px;
        padding: 0;
        height: 38px;
        line-height: 38px;
        text-align: center;
    }
}

.evaluate-add {
    margin-bottom: 20px;

    button {
        // padding: 10px 20px;
    }
}


.quality-user {
    font-size: 0;

    >span {
        margin: 0 10px 14px 0;

        &:nth-of-type(4n) {
            margin: 0 0 14px 0;
        }
    }

    >span,
    >button {
        display: inline-block;
        vertical-align: top;
        width: 148px;
        height: 58px;
        text-align: center;
        line-height: 58px;
        border: 1px solid #DDDDDD;
        border-radius: 4px;
        font-size: 14px;
        color: #000000;
        position: relative;
        background: none;
        padding: 0;
        @extend .i_text;

        i {
            position: absolute;
            top: 8px;
            right: 8px;
        }

        .el-icon-close {
            &:hover {
                color: red;
            }
        }
    }

    >button {
        i {
            position: static;
            color: #348EFC;
            font-size: 18px;
        }
    }
}

.evaluate-add {
    .quality-title {
        border: 0;
    }

    .evaluate-title {
        border-top: 1px solid #E6E6E6;
    }
}


.evaluate-date {
    margin: 40px 0 60px;
}


.self-operation {
    .evaluate-table {
        margin-top: 40px;
    }

}


.self-evaluate {
    .quality-title {
        margin-bottom: 30px;

        span {
            font-size: 14px;
            color: #000000;
            font-weight: bold;
            margin-left: 8px;
        }
    }

    .self-user {
        display: flex;
        flex-flow: row;

        >div {
            text-align: center;
            margin-right: 47px;

            >span {
                width: 40px;
                height: 40px;
                border-radius: 50%;
                display: block;
                overflow: hidden;

                img {}

            }

            p {

                font-size: 12px;
                color: #000000;
                margin-top: 5px;

            }
        }

        >p {
            font-size: 14px;
            color: #333333;
            letter-spacing: 0.1px;
            line-height: 22px;
            @extend .i_word;
        }

    }
}


.iq {
    background-image: url('../../assets/images/iq.png');
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
}

.q-14 {
    width: 40px;
    height: 40px;
    background-position: -0px -0px;
}

.q-13 {
    width: 28px;
    height: 28px;
    background-position: -0px -50px;
}

.q-11 {
    width: 28px;
    height: 28px;
    background-position: -0px -87px;
}

.q-3 {
    width: 28px;
    height: 28px;
    background-position: -0px -125px;
}

.q-2 {
    width: 28px;
    height: 28px;
    background-position: -0px -164px;
}

.q-6 {
    width: 28px;
    height: 28px;
    background-position: -0px -208px;
}

.q-4 {
    width: 28px;
    height: 28px;
    background-position: -0px -249px;
}

.q-5 {
    width: 28px;
    height: 28px;
    background-position: -0px -291px;
}

.q-12 {
    width: 28px;
    height: 28px;
    background-position: -0px -330px;
}

.q-1 {
    width: 28px;
    height: 28px;
    background-position: -0px -375px;
}

.q-7 {
    width: 28px;
    height: 28px;
    background-position: -0px -414px;
}

.q-15 {
    width: 22px;
    height: 22px;
    background-position: -0px -453px;
}

.q-10 {
    width: 20px;
    height: 21px;
    background-position: -0px -520px;
}

.q-8 {
    width: 14px;
    height: 14px;
    background-position: -0px -492px;
}

.q-9 {
    width: 10px;
    height: 10px;
    background-position: -0px -562px;
}

.evaluate-commentList {
    margin-top: 40px;

    .self-user {
        margin-bottom: 20px;
    }
}

.student-details-taps {
    .el-tabs__nav-wrap {
        &::after {
            height: 0;
        }

    }

    .el-tabs__active-bar {
        background-color: #0000
    }
}


.grading-wp {
    padding: 40px;
}

.grading-box {
    h3 {
        font-size: 14px;
        font-weight: bold;
    }
}

.grading-list {
    font-size: 0;
    margin: 28px 0 30px 0;

    li {
        display: inline-block;
        vertical-align: top;
        margin: 0 50px 10px 0;

        span {
            display: inline-block;
            vertical-align: top;
            font-size: 14px;

            &:nth-of-type(1) {
                // width: 55px;
                overflow: hidden;
            }

            &:nth-of-type(2) {}
        }
    }
}


.grading-sum {
    font-size: 18px;
    color: #000000;
    line-height: 31px;
    font-weight: bold;

    em {
        font-size: 20px;
        color: #cc710c;
    }
}

.self-evaluate-margin {
    margin-top: 40px;
}


.w-e-text-container .w-e-panel-container .w-e-panel-tab-content {
    padding: 0;

    .w-e-item {
        width: 33px;
        margin: 5px;
    }
}


.hideActive {
    height: 200px;
    overflow: hidden;
}



#div1 {
    img {
        width: 25px;
        height: 25px;
    }
}



.uploader-close-box {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .3);
    z-index: 99;

    >img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .el-upload-list__item-status-label {
        display: block;
        position: absolute;
        right: -17px;
        top: -7px;
        width: 46px;
        height: 26px;
        background: #13ce66;
        text-align: center;
        transform: rotate(45deg);
        box-shadow: 0 1px 1px #ccc;

        .el-icon-check {
            font-size: 12px;
            margin-top: 12px;
            color: #fff;
            transform: rotate(-45deg);
            font-family: 'element-icons' !important;
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            vertical-align: baseline;
            display: inline-block;
            -webkit-font-smoothing: antialiased;
        }

        .el-icon-check:before {
            content: "\E6DA";
        }

        .el-icon-close {
            display: none;
        }
    }
}

.uploader-close-box:hover {
    .el-upload-list__item-status-label {
        top: -4px;
        right: -15px;
        background: #f56c6c;
        box-shadow: none;
        cursor: pointer;

        .el-icon-check {
            display: none;
        }

        .el-icon-close {
            position: absolute;
            transform: rotate(-45deg);
            top: 10px;
            color: #fff;
            right: 14px;
            font-family: 'element-icons' !important;
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            vertical-align: baseline;
            display: inline-block;
            -webkit-font-smoothing: antialiased;
        }

        .el-icon-close:before {
            content: "\E6DB";
        }
    }
}

.zh-studystatus-import {
    .zh-import-comter {
        margin-top: 20px;

        >button {
            font-size: 12px;
            padding: 9px 20px;
        }

        .uploader-btn {
            font-size: 12px;
            padding: 7px 20px;
            background: #FFF;
            border-radius: 4px;
            border: 1px solid #DCDFE6;

            &:hover {
                border-color: #409EFF;
                color: #409EFF
            }
        }
    }

    .uploader-example {
        margin-top: 20px;
    }

    .zh-import-text {
        font-size: 12px;
        color: #999;
        line-height: 30px;
        margin: 20px 0;

        p {
            margin: 0;
        }

        span {
            color: red;
        }
    }

    .zh-import-table {
        p {
            font-size: 16px;
            margin-bottom: 20px;
        }
    }

    .uploader-list {
        .uploader-file-pause {
            display: none !important;
        }

        .uploader-file-status {
            text-indent: 0;
        }
    }

    .el-table__header-wrapper table thead {
        tr:first-child {
            th:not(:last-child) {
                border-right: 1px solid #EBEEF5;
            }

            th {
                // border-bottom: none;
            }
        }

        tr:last-child {

            th:first-child,
            th:nth-child(17) {
                color: red;
            }

            th:nth-child(16),
            th:nth-child(27),
            th:nth-child(33) {
                border-right: 1px solid #EBEEF5;
            }
        }
    }
}


.txt-error {
    font-size: 12px;
    color: red;
    position: absolute;
    left: 0;
    bottom: -17px;
}


.examine-by-me {

    >ul {
        overflow: hidden;
        width: 100%;
        min-width: 1200px;
        min-height: 590px;

        >li {
            float: left;
            box-sizing: border-box;
            margin-bottom: 15px;
            margin-right: 15px;
            padding: 35px 25px 0;
            width: 390px;
            height: 280px;
            background: #fff;
            box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
            border-radius: 4px;

            &:nth-child(3n) {
                margin-right: 0;
            }

            .title {
                height: 50px;

                .avatar {
                    width: 50px;
                    height: 50px;
                    border-radius: 50%;
                    overflow: hidden;
                }

                .awaitIcon {
                    position: relative;
                    top: -22px;
                    right: -6px;
                }

                >p {
                    overflow: hidden;
                    padding: 16px 0 0 20px;
                    font-size: 14px;
                    color: #000000;
                    line-height: 20px;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
            }

            >ul {
                margin-top: 38px;
                height: 120px;

                >li {
                    margin-bottom: 14px;
                    font-size: 14px;
                    color: #333333;
                    line-height: 20px;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    overflow: hidden;

                    &:last-child {
                        overflow: hidden;
                    }
                }
            }

            .time {
                font-size: 12px;
                color: #666666;
                letter-spacing: 0;

                >p {
                    width: 50%;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    overflow: hidden;
                }
            }
        }
    }


    .el-pagination {

        button,
        .el-pager li {
            background: transparent;
        }

        .el-pager .active {
            background: #409EFF;
        }
    }


    .nothing {
        margin-top: 20px;
        padding-top: 120px;
        height: 372px;
        background: #fff;
        box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
        border-radius: 3px;

        >img {
            margin: 0 auto;
            display: block;
        }

        >p {
            margin-top: 38px;
            font-size: 18px;
            text-align: center;
            color: #a2b2bb;
        }
    }


    .el-dialog__wrapper {


        .previewImage {
            position: relative;
            height: 80vh;

            >img {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                max-width: 100%;
                max-height: 100%;
            }
        }


        .examineDetil {
            height: 800px;
            overflow-x: hidden;

            >div {
                padding: 20px 30px 20px 43px;
                border-bottom: 1px solid #EFEFEF;

                &:last-child {
                    border: 0;
                }

                &.title {
                    position: relative;
                    height: 60px;

                    .avatar {
                        width: 60px;
                        height: 60px;
                        border-radius: 50%;
                        overflow: hidden;
                    }

                    >div:first-of-type {
                        margin-left: 25px;
                        height: 100%;

                        >p {
                            height: 50%;
                            line-height: 30px;

                            &:first-child {
                                font-size: 16px;
                                color: #000000;
                            }

                            &:last-child {
                                font-size: 14px;
                                color: #999999;

                                >span {
                                    font-size: 14px;
                                    color: #d79e36;
                                }

                            }

                        }

                    }

                    >div:last-of-type {
                        padding-top: 10px;

                        >img {
                            margin-left: 30px;
                        }

                    }

                    .statusIcon {
                        position: absolute;
                        top: 79px;
                        right: 65px;
                        width: 93px;
                        height: 71px;
                    }

                }

                // 审批申请单详情
                &.contentDetail {

                    >ul {
                        // max-height: 460px;
                        overflow-x: hidden;

                        >li {
                            margin-top: 12px;
                            font-size: 16px;
                            line-height: 28px;

                            // 公共板块
                            >span {

                                &:first-child {
                                    width: 165px;
                                    color: #666666;
                                }

                                &:last-child {
                                    margin-left: 16px;
                                    width: 525px;
                                    max-height: 140px;
                                    overflow-x: hidden;
                                    color: #000000;
                                }

                            }

                            // 日期、日期区间
                            .title2 {
                                width: 165px;
                                color: #666666;
                            }

                            .content,
                            .content2 {
                                margin-left: 16px;
                                width: 525px;
                                max-height: 140px;
                                overflow-x: hidden;
                                color: #000000;
                            }

                            // 图片列表
                            >ul {
                                width: 500px;

                                li {
                                    position: relative;
                                    margin: 15px 15px 0 0;
                                    border-radius: 6px;
                                    overflow: hidden;

                                    &:nth-child(-n+3) {
                                        margin-top: 0;
                                    }

                                    &:nth-child(3n) {
                                        margin-right: 0;
                                    }

                                    >img {
                                        width: 150px;
                                        height: 150px;
                                        border: 1px solid #ddd;
                                        border-radius: 6px;
                                        object-fit: cover;
                                    }

                                    .cover {
                                        display: none;
                                        position: absolute;
                                        top: 0;
                                        bottom: 0;
                                        left: 0;
                                        right: 0;
                                        background: rgba(0, 0, 0, 0.5);

                                        .el-icon-zoom-in {
                                            position: absolute;
                                            top: 50%;
                                            left: 50%;
                                            transform: translate(-50%, -50%);
                                            font-size: 20px;
                                            color: white;
                                        }
                                    }

                                    &:hover .cover {
                                        display: block;
                                    }
                                }
                            }

                            // 说明文字跳转链接
                            .url {
                                color: #666666;

                                &:hover {
                                    color: blue;
                                }
                            }

                            // 下载附件
                            .download {
                                &:hover {
                                    color: blue;
                                }
                            }

                            // 明细
                            .detail {
                                .topLine {
                                    display: block;
                                    border-bottom: 2px dashed #ddd;
                                }

                                .bottomLine {
                                    display: block;
                                    padding-top: 15px;
                                    border-bottom: 2px dashed #ddd;
                                }

                                .detailTitle {
                                    display: block;
                                    padding: 10px 0;
                                }

                                >ul {
                                    // max-height: 460px;
                                    overflow-x: hidden;

                                    >li {
                                        // margin-top: 12px;
                                        font-size: 16px;
                                        line-height: 28px;

                                        // 公共板块
                                        >span {

                                            &:first-child {
                                                margin-left: 30px;
                                                width: 165px;
                                                color: #666666;
                                            }

                                            &:last-child {
                                                margin-left: 16px;
                                                width: 495px;
                                                max-height: 140px;
                                                overflow-x: hidden;
                                                color: #000000;
                                            }

                                        }

                                        // 日期、日期区间
                                        .title2 {
                                            margin-left: 30px;
                                            width: 165px;
                                            color: #666666;
                                        }

                                        .content,
                                        .content2 {
                                            margin-left: 16px;
                                            width: 495px;
                                            max-height: 140px;
                                            overflow-x: hidden;
                                            color: #000000;
                                        }

                                        // 图片列表
                                        >ul {
                                            width: 495px;

                                            li {
                                                position: relative;
                                                margin: 15px 15px 0 0;
                                                border-radius: 6px;
                                                overflow: hidden;

                                                &:nth-child(-n+3) {
                                                    margin-top: 0;
                                                }

                                                &:nth-child(3n) {
                                                    margin-right: 0;
                                                }

                                                >img {
                                                    width: 150px;
                                                    height: 150px;
                                                    border: 1px solid #ddd;
                                                    border-radius: 6px;
                                                    object-fit: cover;
                                                }

                                                .cover {
                                                    display: none;
                                                    position: absolute;
                                                    top: 0;
                                                    bottom: 0;
                                                    left: 0;
                                                    right: 0;
                                                    background: rgba(0, 0, 0, 0.5);

                                                    .el-icon-zoom-in {
                                                        position: absolute;
                                                        top: 50%;
                                                        left: 50%;
                                                        transform: translate(-50%, -50%);
                                                        font-size: 20px;
                                                        color: white;
                                                    }
                                                }

                                                &:hover .cover {
                                                    display: block;
                                                }
                                            }
                                        }

                                        // 说明文字跳转链接
                                        .url {
                                            margin-left: 30px;
                                            color: #666666;

                                            &:hover {
                                                color: blue;
                                            }
                                        }

                                        // 下载附件
                                        .download {
                                            &:hover {
                                                color: blue;
                                            }
                                        }

                                        &:first-child {
                                            margin: 0;
                                        }

                                    }

                                }

                            }

                            &:first-child {
                                margin: 0;
                            }

                        }

                    }

                }

                // 审批流程
                &.flow {

                    >ul {

                        >li {
                            letter-spacing: 0.11px;
                            font-size: 14px;

                            .left {

                                >img {
                                    width: 40px;
                                    height: 40px;
                                    border-radius: 50%;
                                    overflow: hidden;
                                }

                                >i {
                                    margin: 5px 0 5px 19px;
                                    display: block;
                                    width: 2px;
                                    height: 30px;
                                    background: #DDDDDD;
                                }

                            }

                            .content {
                                overflow: hidden;

                                >span {
                                    height: 40px;
                                    line-height: 40px;
                                    overflow: hidden;
                                    // text-align: center;
                                    text-overflow: ellipsis;
                                    white-space: nowrap;

                                    &.name {
                                        margin-left: 20px;
                                        width: 80px;
                                        // text-align: left;
                                        color: #666666;
                                    }

                                    // 黑色（发起申请）
                                    &.sponsor {
                                        margin: 0 15px;
                                        width: 60px;
                                        font-size: 14px;
                                        // text-align: center;
                                        color: #000000;
                                    }

                                    // 棕色（审批中）
                                    &.underway {
                                        margin: 0 15px;
                                        width: 60px;
                                        color: #CC8401;
                                        // text-align: center;
                                    }

                                    // 蓝绿色（已通过）
                                    &.resolve {
                                        margin: 0 15px;
                                        width: 60px;
                                        color: #33BBBB;
                                        // text-align: center;
                                    }

                                    // 红色（拒绝）
                                    &.reject {
                                        margin: 0 15px;
                                        padding: 0;
                                        width: 60px;
                                        color: #CD5B72;
                                        // text-align: center;
                                    }

                                    // 灰色（已撤销）
                                    &.revocation {
                                        margin: 0 15px;
                                        width: 60px;
                                        color: #eee;
                                        // text-align: center;
                                    }

                                    &.history {
                                        color: #348EFC;
                                    }

                                    &.time {
                                        margin-left: 10px;
                                        font-size: 12px;
                                        color: #999999;
                                        overflow: hidden;
                                    }

                                }

                                >p {
                                    margin-left: 20px;
                                    line-height: 20px;
                                    font-size: 14px;
                                    color: #333333;
                                    overflow: hidden;
                                    text-overflow: ellipsis;
                                    white-space: nowrap;
                                }

                            }

                            &:last-child {
                                .left {
                                    >i {
                                        display: none;
                                    }
                                }
                            }

                        }

                    }

                }

                // 抄送人
                &.copyTo {
                    >dl {
                        width: 100%;
                        // max-height: 136px;
                        white-space: nowrap;
                        overflow-x: hidden;

                        >dt {
                            font-size: 12px;
                            line-height: 16px;
                            color: #333333;
                        }

                        >dd {
                            margin-top: 20px;
                            margin-right: 10px;
                            display: inline-block;
                            width: 60px;
                            max-height: 90px;
                            min-height: 66px;
                            text-align: center;

                            >img {
                                display: block;
                                margin: 0 auto;
                                margin-bottom: 6px;
                                width: 40px;
                                height: 40px;
                                border-radius: 50%;
                                overflow: hidden;
                            }

                            >p {
                                max-height: 32px;
                                line-height: 16px;
                                white-space: normal;
                                font-size: 12px;
                                color: #666666;
                                letter-spacing: 0.1px;
                                text-align: center;
                                text-overflow: -o-ellipsis-lastline;
                                -webkit-box-orient: vertical;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                display: -webkit-box;
                                -webkit-line-clamp: 2;
                                line-clamp: 2;
                            }

                            &.noPeople {
                                font-size: 12px;
                                line-height: 16px;
                                text-align: left;
                                color: #999999;
                            }

                        }

                    }

                }

                // 操作栏
                &.control {
                    padding-top: 10px;
                    padding-bottom: 10px;
                    height: auto;
                    background: #FAFAFA;

                    .center {
                        position: relative;
                        height: 52px;

                        .urge {
                            position: relative;
                            margin-left: 80px;
                            width: 46px;
                            font-size: 12px;
                            color: #348EFC;
                            border: 0 none;
                            background: #FAFAFA;


                            >img {
                                margin: 0 auto;
                                margin-bottom: 6px;
                                display: block;
                                width: 28px;
                            }

                            .urgeTime {
                                position: absolute;
                                top: 3px;
                                right: -36px;
                                min-width: 36px;
                                height: 28px;
                                line-height: 28px;
                                font-family: MicrosoftYaHei;
                                font-size: 14px;
                                color: #FFFFFF;
                                letter-spacing: 0.11px;
                                text-align: center;
                                background: #C9C9C9;
                                border-radius: 14px;
                            }

                        }

                        .recall {
                            margin-right: 93px;
                            width: 46px;
                            font-size: 12px;
                            color: #348EFC;
                            border: 0 none;
                            background: #FAFAFA;

                            >img {
                                margin: 0 auto;
                                margin-bottom: 6px;
                                display: block;
                                width: 28px;
                            }
                        }

                        .comment {
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                            width: 32px;
                            font-size: 12px;
                            color: #348EFC;
                            border: 0 none;
                            background: #FAFAFA;

                            >img {
                                margin-bottom: 6px;
                                width: 100%;
                            }

                        }

                    }

                    .btn {

                        >button {
                            display: inline-block;

                            &.comment {
                                margin-right: 30px;
                                width: 32px;
                                font-size: 12px;
                                color: #348EFC;
                                background: #FAFAFA;
                                border: 0 none;

                                >img {
                                    margin-bottom: 6px;
                                    width: 100%;
                                }

                            }

                            &.transpond {
                                width: 34px;
                                font-size: 12px;
                                color: #348EFC;
                                background: #FAFAFA;
                                border: 0 none;

                                >img {
                                    margin-bottom: 6px;
                                    width: 100%;
                                }

                            }

                        }

                        >div {
                            margin: 0 auto;
                            padding-top: 13px;
                            width: 146px;

                            .el-button--danger {
                                left: 327px;
                            }

                            .el-button--primary {
                                right: 327px;
                            }

                            .el-button {
                                padding: 0;
                                width: 68px;
                                height: 30px;
                                font-size: 14px;
                                border: 0 none;

                            }

                        }

                    }

                }

            }

        }

        // 评论弹窗
        .inputComment {
            padding: 25px 30px 0;

            .el-textarea__inner {
                width: 490px;
                height: 180px;
                resize: none;
            }
        }

        // 转交弹窗
        .deliver {
            padding: 25px 30px 0;
            font-size: 14px;
            line-height: 20px;
            color: #000000;

            >div {
                >span {
                    margin-right: 7px;
                    width: 110px;
                }

                &:first-child {
                    >button {
                        color: #348EFC;
                        border: 0 none;
                        background: #fff;
                    }
                }

                &:last-child {
                    margin-top: 20px;

                    .el-textarea {
                        width: 373px;

                        >textarea {
                            height: 200px;
                            resize: none;
                        }
                    }
                }

            }

        }

        // 选择角色弹窗
        .addMember {
            padding: 20px 40px 0;
            font-size: 16px;

            >div {
                &:first-child {
                    width: 260px;

                    .el-select {
                        width: 260px;
                    }

                    .el-input {
                        input {
                            font-size: 14px;
                        }

                        input::-webkit-input-placeholder {
                            font-size: 14px;
                        }
                    }
                }

                &:nth-child(2) {
                    margin-left: 20px;
                    width: 300px;

                    .el-input__icon.el-icon-search {
                        font-size: 18px;
                        cursor: pointer;
                    }

                    .el-input {
                        input {
                            font-size: 14px;
                        }

                        input::-webkit-input-placeholder {
                            font-size: 14px;
                        }
                    }
                }

                &:nth-child(3) {
                    margin-top: 20px;
                    padding: 4px;
                    box-sizing: border-box;
                    width: 260px;
                    height: 288px;
                    border: 1px solid #DDDDDD;

                    >ul {
                        height: 100%;
                        overflow-X: hidden;

                        li {
                            height: 36px;

                            span {
                                box-sizing: border-box;
                                margin: 8px 0;
                                padding-left: 8px;
                                width: 40%;
                                height: 20px;
                                font-size: 14px;
                                line-height: 20px;
                                color: #000000;
                                letter-spacing: 0.11px;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                white-space: nowrap;

                                &:last-child {
                                    width: 17%;
                                    color: #348EFC;
                                }
                            }
                        }
                    }
                }

                &:nth-child(4) {
                    position: relative;
                    margin-top: 20px;
                    margin-left: 20px;
                    padding-top: 36px;
                    box-sizing: border-box;
                    width: 440px;
                    height: 288px;
                    border: 1px solid #DDDDDD;
                    overflow: hidden;

                    >ul {
                        overflow-X: hidden;
                        height: 100%;

                        li {
                            &:first-child {
                                position: absolute;
                                top: 0;
                                left: 0;
                                right: 0;
                                padding-right: 15px;
                                background: #EFEFEF;

                                span:first-child {
                                    box-sizing: border-box;
                                    padding-left: 27px;
                                }
                            }

                            width:425px;
                            height:36px;
                            font-size: 14px;
                            color: #000000;
                            letter-spacing: 0.11px;

                            span {
                                box-sizing: border-box;
                                margin: 8px 0;
                                padding-left: 8px;
                                width: 38%;
                                height: 20px;
                                font-size: 14px;
                                line-height: 20px;
                                color: #000000;
                                letter-spacing: 0.11px;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                white-space: nowrap;

                                &:first-child {
                                    vertical-align: middle;

                                    .el-icon-close.pointer {
                                        vertical-align: middle;
                                        font-size: 20px;
                                        color: #999999;

                                        &:hover {
                                            color: #5cb6ff;
                                        }
                                    }

                                }

                                &:nth-child(2) {}

                                &:last-child {
                                    width: 23%;
                                    padding-left: 14px;
                                }
                            }
                        }
                    }
                }
            }
        }

        // 拒绝、同意弹窗
        .consent,
        .reject {
            padding: 25px 30px 0;

            .el-textarea {
                >textarea {
                    height: 200px;
                    resize: none;
                }

            }

        }

        // 撤销弹窗
        p.recall {
            padding-top: 50px;
            text-align: center;
        }

        // 转交历史弹窗
        .deliverHistory {
            padding: 50px;
            min-height: 204px;
            max-height: 500px;
            overflow-x: hidden;

            >ul {
                >li {
                    letter-spacing: 0.11px;
                    font-size: 14px;

                    .left {
                        width: 36px;

                        >i {
                            position: relative;
                            top: 14px;
                            left: 12px;
                            display: block;
                            width: 12px;
                            height: 12px;
                            border-radius: 50%;
                            overflow: hidden;
                            background: #76a8e6;
                        }

                    }

                    .content {
                        position: relative;
                        margin-left: 36px;
                        width: 400px;

                        >span {
                            height: 40px;
                            line-height: 40px;
                            color: #666666;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            white-space: nowrap;

                            &:first-child {
                                margin-left: 20px;
                            }


                            &.turn {
                                margin: 0 14px;
                                color: #999999;
                            }

                            &.time {
                                margin-left: 72px;
                                font-size: 12px;
                                color: #999999;
                                overflow: hidden;
                            }

                        }

                        >p {
                            margin-left: 20px;
                            min-height: 68px;
                            line-height: 20px;
                            font-size: 14px;
                            color: #000000;
                            overflow: hidden;
                            // white-space: nowrap;
                            // text-overflow: ellipsis;

                        }

                        >i {
                            position: absolute;
                            top: 26px;
                            left: -19px;
                            width: 2px;
                            height: 100%;
                            background: #DDDDDD;
                        }

                    }

                    &:last-child {
                        .content {
                            >i {
                                display: none;
                            }

                        }

                    }

                }

            }

        }

    }

}

.w-e-text .e-placeholder {
    color: #999
}

.txt-content {
    height: 150px;

    .w-e-text-container {
        height: calc(100% - 25px) !important;
    }


    >div {
        background-color: #0000 !important;
        border: 1px solid #ddd !important;

        &:last-of-type {
            border-top: 0 !important;
        }
    }

    img[data-w-e] {
        width: 26px;
        height: 26px;
    }

    .w-e-menu {
        z-index: 2 !important;
    }

    .w-e-text-container {
        z-index: 1 !important;
    }
}


.resource-ruleForm {
    .el-col-8 {
        width: 30%;

        &:nth-of-type(2n) {
            margin: 0 45/920*100%;
        }
    }

    .list_2_id {
        width: 30%;

        .el-col-8 {
            width: 100%;
        }
    }
}


.pointMark_video {

    .vjs-big-play-button,
    .vjs-control-bar {
        z-index: 1;
    }
}


.preview-next {
    padding: 20px 20px 10px;

    button {
        padding: 5px 15px;
        font-size: 12px;
    }
}

.preview-conten-list {
    &:last-of-type {
        .preview-next {
            display: none;
        }
    }
}


.w-e-text {
    overflow-y: auto !important;
}


.detailappoint {

    .el-input.is-disabled .el-input__inner,
    .el-textarea.is-disabled .el-textarea__inner {
        background-color: #ffffff;
    }

    .el-input.is-disabled .el-input__icon {
        display: none;
    }
}


.uploader-file .uploader-file-progress {
    background: #338efc;
}


.uploader-file {
    .uploader-file-status {
        opacity: 0;
    }

    .uploader-file-resume {
        display: none !important;
    }
}

.el-table .warning-row {
    background: #f0f9eb;
}


.account-form {
    padding: 20px 30px;
}



video::-internal-media-controls-download-button {
    display: none;
}

video::-webkit-media-controls {
    overflow: hidden !important;
}

video::-webkit-media-controls-enclosure {
    width: calc(100% + 48px);
    margin-left: auto;
}